在触发器可观察对象上对某些可观察对象执行操作 - RxJS

Question

我仍在尝试将 RxJS 与 React Native 结合使用。我正在构建一个带有 ID TextInput、密码 TextInput 和登录按钮的登录屏幕，它们都通过 jsx 附加了一个单独的回调处理程序（因此我无法使用 'fromEvent' API 的 RxJS).

在 componentWillMount 中，我为 ID 文本更改、密码文本更改和点击处理程序创建了一个主题。

//In id text change handler
this.idStream.onNext(newId);

//In password text change handler
this.passwordStream.onNext(newPassword);

//In click handler
this.buttonClickStream.onNext(null); //null since value is not important

我只希望在按钮 ID 和密码不是空字符串并且按钮被单击时触发 API 请求。

在 componentWillMount 我试过了

var subscription = this.buttonClickStream
                       .combineLatest(this.idStream, this.passwordStream, function(click, id, password) {
    return {
         id: id,
         password: password
    };
})
.filter(credentials => {return credentials.id.length > 0 &&
                               credentials.password.length > 0;}
.subscribe(function(credentials) {
    console.log('fire API request with credentials');
});

但是问题是，因为我使用的是 combineLatest，所以 api 不仅在按钮单击时触发，而且每次我更改 ID 或密码时都会触发（前提是它们通过过滤器).我错过了什么？

谢谢！

Answer 1

我认为您可以使用 Rx.withLatestFrom 而不是 combineLatest。它仅在源 observable 触发时触发，并将您传递的 observable 的最后发射值作为参数。

比照。 http://rxmarbles.com/#withLatestFrom

在触发器可观察对象上对某些可观察对象执行操作 - RxJS

Performs operations on some observables on trigger observables - RxJS

javascript

frp

rxjs

reactjs

react-native