javascript - 如何在 Chrome 或 Firefox 开发者工具控制台中使用 RxJS Observable?

标签 javascript rxjs google-chrome-devtools firefox-developer-tools

我想快速测试一些与 Observable 相关的功能。在我的 Chrome 开发者工具中(或 Firefox 开发者工具,无所谓)。

在我看来,几天前我能够简单地执行这样的代码:

var test$ = Rx.Observable.from([1,2,3]);

直接在我的 JavaScript 控制台中。我的记忆似乎更加正确,因为我实际上已经从我的开发工具控制台历史中挖掘出这个示例(以及许多其他示例)!


由于某种原因,它不再工作了;我收到此错误:

Uncaught ReferenceError: Rx is not defined

或者如果我只是使用 Observable 而不是 Rx.Observable

Uncaught ReferenceError: Observable is not defined


不可能在 Chrome 控制台中“按原样”使用 import 语句。有人有使用浏览器的 Javascript 控制台调试 RxJS 代码的解决方案吗?

最佳答案

2020 年 12 月更新:

浏览器控制台中的 RxJS 回来了!

只需转到 https://rxjs.dev/并打开 devtools 控制台 :)

 ____           _ ____      
|  _ \ __  __  | / ___|    
| |_) |\ \/ /  | \___ \  
|  _ <  >  < |_| |___) |    
|_| \_\/_/\_\___/|____/ 

started experimenting with RxJS:

type this into the console:

rxjs.interval(500).pipe(rxjs.operators.take(4)).subscribe(console.log)

2018 年 11 月更新:

我刚刚注意到我之前的答案(以及已接受的答案)不再有效。 https://reactive.io网站现在重定向到 https://rxjs-dev.firebaseapp.com/并显示:

 ____           _ ____      
|  _ \ __  __  | / ___|    
| |_) |\ \/ /  | \___ \  
|  _ <  >  < |_| |___) |    
|_| \_\/_/\_\___/|____/ 

Open http://stackblitz.com and try this code to get
started experimenting with RxJS:

import { interval } from "rxjs"

import { take } from "rxjs/operators"

const subscription = interval(500).pipe(take(4)).subscribe(console.log)

所以现在Stackblitz是“官方”方式。

原帖:

回到ReactiveX documentation之后,我通过查看底部的内容得到了确认:

Hint: open your DevTools to experiment with RxJS.

我只是忘了只有打开开发工具才能使用 from the reactivex.io/rxjs page itself :

RxJS in Chrome developer tools

关于javascript - 如何在 Chrome 或 Firefox 开发者工具控制台中使用 RxJS Observable?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49156682/

相关文章:

javascript - 解析 JSON 字符串的问题

javascript - 如何在 asp.net 弹出表单上编写日期选择器代码

rxjs - 使用 RxJ 执行顺序 api 调用?

javascript - 如何使用 Google Chrome 检查器查看 cookie?

javascript - 流氓 sourceMap 阻止 Chrome DevTools 调试

javascript - Jquery 获取 DIV 中被点击的 DIV 的类

javascript - 如何在 Javascript 中舍入一个数字?

angular - 在 HTTP 超时时保持订阅 RXJS 主题

Angular rxjs concat 2 Observables 并返回它们的元组

google-chrome-devtools - 如何在 Chrome devtools > Sources > Page > top > (no domain) (files with//# sourceURL=...) 中启用文件夹