在引用最新的rxjs时得到rxjs错误

时间:2016-04-14 03:07:50

标签: javascript rxjs rxjs5

我正在使用本教程https://egghead.io/lessons/rxjs-creating-an-observable,它引用了2.5.2 rxjs版本。

我引用了来自rx.umd.js npm包rxjs@5.0.0-beta.6"的最新<script src="node_modules/rxjs/bundles/rx.umd.js"></script> 这是我试图运行的代码:

console.clear();

var source = Rx.Observable.create(function(observer){
    setTimeout(function() {
        console.log('timeout hit');
        observer.onNext(42);
        observer.onCompleted();
    }, 1000);

    console.log('started');
});

var sub = source.subscribe(function(x) {
    console.log('next ' + x);
}, function(err) {
    console.error(err);
}, function() {
    console.info('done');
});

setTimeout(function() {
    sub.dispose()
}, 500);

这是我得到的控制台输出。

Console was cleared
script.js:10 started
script.js:22 Uncaught TypeError: sub.dispose is not a function
script.js:5 timeout hit
script.js:6 Uncaught TypeError: observer.onNext is not a function

plunker:https://plnkr.co/edit/w1ZJL64b8rnA92PVuEDF?p=catalogue

rxjs 5 api与rxjs 2.5和observer.onNext(42);有很大的不同,sub.dispose()不再受支持吗?

2 个答案:

答案 0 :(得分:9)

更新2018/12:

RxJS v6.x引入了一种新的,更“功能”的API。有关详细信息,请查看5>6 migration guide。原始示例代码仍然有效,但您必须导入of运算符,如下所示:

// ESM
import { of } from 'rxjs'
// CJS
const { of } = require('rxjs');

原创RxJS 5回答:

没错。重写RxJS 5是为了提高性能并符合ES7 Observable规范。查看Github上的RxJS 4->5 migration page

这是一个有效的例子:

// Create new observable
const one = Observable.of(1,2,3);

// Subscribe to it
const oneSubscription = one.subscribe({
    next: x => console.log(x),
    error: e => console.error(e),
    complete: () => console.log('complete')
});

// "Dispose"/unsubscribe from it
oneSubscription.unsubscribe();

许多方法都被重命名,但API本身很容易过渡到。

答案 1 :(得分:0)

不确定这是否可以帮助某个人,但是我最终在这里遇到类似的错误:

old.dispose is not a function

在我的情况下,问题是我将一些旧的rxjs与来自较新版本的rxjs的可观察对象混合在一起。

所以我通过更新所有调用以使用最新的rxjs来解决。