javascript - 对触发可观察量上的某些可观察量执行操作 - RxJS

标签 javascript reactjs react-native rxjs frp

我仍在尝试使用 RxJS 和 React Native。我正在构建一个带有 id TextInput、密码 TextInput 和登录按钮的登录屏幕,它们都通过 jsx 附加了一个单独的回调处理程序(因此我无法使用 RxJS 的“fromEvent”API 创建可观察对象)。

在 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或密码时都会触发(前提是它们通过了过滤器)。我错过了什么?

谢谢!

最佳答案

我认为您可以使用Rx.withLatestFrom而不是combineLatest。仅当源可观察值触发并采用您作为参数传递的可观察值的最后发出的值时,它才会触发。

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

关于javascript - 对触发可观察量上的某些可观察量执行操作 - RxJS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33272168/

相关文章:

javascript - Chosen JS - 将optgroup添加到所选项目

Javascript - 类型检查的正确方法

javascript - 在后台录制音频

react-native - Realm : delete specific object

android - 在 react-native Android 发布版本上查看控制台日志

javascript - 告诉函数 'nicely' 的调用者无法满足 promise

javascript - 在不同端口的本地主机上的 2 个 Angular SPA 之间共享 sessionStorage

reactjs - Firebase 身份验证和 React Hook - 从钩子(Hook)返回的函数不起作用

javascript - 如何使用react-google-maps从两个不同的SearchBoxes中获取formatted_address?

javascript - React Native如何消费Image.prefetch的结果?