Question

RxJS有一个漂亮的函数fromCallback，它接受一个函数，其最后一个参数是一个回调并返回一个Observable。我希望将它与React的setState函数结合起来，以便我可以做类似的事情：

const setState = Rx.Observable.fromCallback(this.setState);
setState({ myState: 'Hi there!' }).concat(....)

以便在设置状态后保证链接到setState的任何操作都会发生，最重要的是，setState不会被调用，直到有活跃用户为止。

我注意到的是，即使没有订阅，setState也会被定义为正确，并设置我的组件的状态。如果我有：

networkSignal.flatMap((x) => {
    return setState({ myState: 'test' });
});

立即调用函数setState，但生产者的观察者不会发送下一个直到订阅者。我想要的是该功能只有在订户时才会调用。

查看源代码，您可以看到RxJS返回一个函数，该函数在执行时创建一个observable但会立即调用该函数 - 回调参数。

Answer 1

fromCallback返回一个函数，该函数在执行时返回一个observable。该可观察量是函数调用的异步结果将流动的位置。

要延迟执行该功能，您可以使用.defer。例如：

const setState = Rx.Observable.fromCallback(this.setState);
const deferred$ = Rx.Observable.defer(function (){return setState({ myState: 'Hi there!' }).concat(....)});
// Later on
deferred$.subscribe(...)

问题的答案使用了相同的技术，here和here

RxJS和React的setState - 延迟函数执行直到订阅

1 个答案: