Question

我可以创建2个observable来观看鼠标移动和点击事件：

var mousemove$ = Rx.Observable.fromEvent(document, 'mousemove');
var click$ = Rx.Observable.fromEvent(document, 'click');

我也可以使用merge（）和debounceTime（）来等待鼠标移动或点击不会发生10秒，如下所示：

var allactivity$ = Rx.Observable.merge(
    mousemove$.mapTo('Mouse!'),
    click$.mapTo('Click!')
  );

var lastact$ = allactivity$.debounceTime(10000);

但是，我想以某种方式构建一个observable，用于当用户重新开始移动鼠标或在此10秒debounceTime（）限制之后单击时。

有人可以帮我构建这个Observable吗？我想我错过了一些简单的事情。

Answer 1

您可以使用以下内容：

var restart$ = Rx.Observable.of('Kick off')
  .merge(lastact$)
  .mergeMap(() => allactivity$.skipUntil(lastact$).first());

说明

Rx.Observable.of('Kick off') - 一旦开始，......
.merge(lastact$) - 并且每次lastact$发出，......
.mergeMap(() => ...) - 创建一个可观察的......
allactivity$ - 会在allactivity$上观察所有项目......
.skipUntil(lastact$) - 自第一个lastact$发射（创建此可观察者之后）......
.first() - 并且只接受第一项（即第一项活动发生在lastact$之后）

修改

上面的observable不会在第一次鼠标移动时触发，以处理：

var firstMoveAndRestart$ = restart$.merge(allactivity$.first());

示例RxJS鼠标或单击活动重新启动时可观察到

1 个答案:

说明