RXJS:第一次拖动后捕获拖动事件不起作用

RXJS: Capture drag events not working after first drag

我有一段代码,我试图在其中捕获所有拖动事件。此代码仅适用于第一次拖动,停止将不适用于连续拖动。

是不是因为takeUntil取消了外层的observable?我怎样才能使代码工作。

const { Observable, fromEvent } = rxjs;
const { takeUntil, switchMap } = rxjs.operators;

const mouseups = fromEvent(document.querySelector('.container'), 
'mouseup'); 
const mousedowns = fromEvent(document.querySelector('.container'), 
'mousedown');
const mousemoves = fromEvent(document.querySelector('.container'), 
'mousemove');

const source = mousedowns.pipe(
  switchMap(e => mousemoves),
  takeUntil(mouseups)
);

source.subscribe(e => console.log(e));

你需要把 takeUntil 放在 switchMap 里面,像这样:

const source = mousedowns.pipe(
  switchMap(e => mousemoves.pipe(
    takeUntil(mouseups)
  ))
);

takeUntil 放入其中,组合的可观察对象将在 mouseup 事件后取消订阅 mousemoves 可观察对象,但仍将订阅 mousedown 可观察对象。

放在外面,它将取消订阅 mousedown 可观察到的 mouseup 事件 - 这就是它在第一次拖动后停止响应的原因。