使用 RxJS 获取“不是函数”错误

Posted

技术标签:

【中文标题】使用 RxJS 获取“不是函数”错误【英文标题】:Getting "is not a function " errors with RxJS 【发布时间】:2018-02-12 14:02:27 【问题描述】:

我在使用 RxJS 时遇到了错误。

我的项目是 Angular、Typescript,我使用 RxJS 作为 NGRX redux 的一部分。

我的代码似乎仅仅作为一个导入就可以正常工作:

import Observable from 'rxjs/Observable'

然后,我不知从哪里开始遇到这样的错误......

Uncaught (in promise): TypeError: this.appStateStore.withLatestFrom is not a function Uncaught (in promise): TypeError: this.appStateStore.take is not a function

我能够通过添加 import 'rxjs/add/operator/withLatestFrom'; 的导入来解决有关 withLatestFrom 的错误,但随后错误转向抱怨 .take

我猜我在某个地方有一个导入错误,因为我理解 RxJS 你需要导入你需要的位。但是,我查看了我的源代码控制更改,我看不到任何会导致这种情况刚刚开始发生的更改(例如节点模块版本、导入语句)。

我做错了什么?

【问题讨论】:

然后添加import 'rxjs/add/operator/distinctUntilChanged'; import 'rxjs/add/operator/take'; 【参考方案1】:
import 'rxjs/add/operator/distinctUntilChanged'; 
import 'rxjs/add/operator/take;

Rxjs v 5.4.1

1)import Rx from 'rxjs/Rx;

这会导入整个库。然后你就不用担心加载每个 operator 了。但是你需要附加 Rx。 我希望 tree-shaking 能够优化并只选择需要的功能(需要验证) 正如 cmets 中提到的,tree-shaking 无济于事。所以这不是优化的方式。

public cache = new Rx.BehaviorSubject('');

或者您可以导入单个运算符。

这将优化您的应用以仅使用这些文件

2) import _______ from 'rxjs/_________';

这种语法通常用于Rx本身或Observable等主对象,

可以使用此语法导入的关键字

 Observable, Observer, BehaviorSubject, Subject, ReplaySubject

3) import 'rxjs/add/observable/__________';

这些通常直接与 Observable 一起使用。例如

Observable.from()
Observable.of()

可以使用此语法导入的其他此类关键字:

concat, defer, empty, forkJoin, from, fromPromise, if, interval, merge, of, 
range, throw, timer, using, zip

4) import 'rxjs/add/operator/_________';

这些通常在 Observable 创建后进入流中。就像这段代码sn-p中的flatMap

Observable.of([1,2,3,4])
          .flatMap(arr => Observable.from(arr));

使用此语法的其他此类关键字:

audit, buffer, catch, combineAll, combineLatest, concat, count, debounce, delay, 
distinct, do, every, expand, filter, finally, find , first, groupBy,
ignoreElements, isEmpty, last, let, map, max, merge, mergeMap, min, pluck, 
publish, race, reduce, repeat, scan, skip, startWith, switch, switchMap, take, 
takeUntil, throttle, timeout, toArray, toPromise, withLatestFrom, zip

平面地图flatMapmergeMap 的别名,所以我们需要导入mergeMap 来使用flatMap


/add 导入注意事项

我们只需要在整个项目中导入一次。所以建议在一个地方做。如果它们包含在多个文件中,并且其中一个被删除,则构建将因错误原因而失败。

【讨论】:

以上是关于使用 RxJS 获取“不是函数”错误的主要内容,如果未能解决你的问题,请参考以下文章

Angular2 RxJS 得到“Observable_1.Observable.fromEvent 不是函数”错误

使用 rxjs 时如何获取错误的堆栈跟踪?

订阅不是函数错误

如何使用 rxjs 算子多次获取最近的值

带有 rxjs 错误的相关请求:可观察 _isScalar: false, _subscribe: f

Observable 错误,执行不同的 observable,重试原始 observable (Angular, RxJs6)