-1
我一直坚持一个rxjs问题几天了。我在REACT中使用rxjs,并尝试获取属性更改流以运行异步函数以快速前进/后退播放器。然后进一步等待任何函数调用,直到回调返回。如果在等待回调期间流中发生任何属性更改,只需执行最后一个属性。然后重复这个过程。如何连续执行异步功能并非只有最新的流
下面是一个示例代码如下。 http://jsbin.com/jagoworawu/edit?js,console
const setCurrentTimeStream = Observable.bindNodeCallback(player.setCurrentTime);
// Instant execute setCurrentTimeStream on first iteration.
// Prevent next setCurrentTimeStream if not callback of previous setCurrentTimeStream was called.
// Skip all except last while waiting for setCurrentTimeStream callback and then execute it.
// Then repeat the process.
const lifecycle$ = props$
.distinctUntilKeyChanged('currentTime')
// tried with audit and throttle but it won't execute the last one
.audit(({ currentTime }) => setCurrentTimeStream(currentTime));
// Probably needs something more here?
编辑: 阅读一些资料后,我想出了这个。请提供反馈或其他解决方案,最好使用rxjs的本地方法。
const latestExecAsync = (input, action) => Observable.create((observer) => {
let queued = false;
let latestValue;
const dequeue = (reference) => {
queued = true;
action(reference.value, (error, value) => {
if (error) return output.error(error);
observer.next(reference.value);
if (reference !== latestValue) {
dequeue(latestValue);
} else {
queued = false;
}
});
};
const subscription = input.subscribe({
next: (value) => {
const reference = latestValue = { value };
if (!queued) dequeue(reference);
},
error: e => observer.error(e),
complete:() => observer.complete(),
});
return() => subscription.unsubscribe();
});
// Usage:
latestExecAync(
props$.distinctUntilKeyChanged('currentTime'),
({ currentTime }, cb) => player.setCurrentTime(currentTime, cb)
)