rxjs - 从 observable 中获取第一个和最后一个发出的值

Question

有没有办法从 observable 中获取第一个和最后一个发出的值？

const down$ = fromEvent(this.canvas, 'mousedown');
const up$ = fromEvent(this.canvas, 'mouseup');
const move$ = fromEvent(this.canvas, 'mousemove');
const drag$ = move$.pipe(
  skipUntil(down$),
  takeUntil(up$)
);
drag$.subscribe((e: MouseEvent) => {
  console.log(e);
});

有没有办法从 drag$ observable 中获取第一个和最后一个值？

Answer 1

您可以使用 take(1) 从 Observable 中获取第一个和最后一个值。和 takeLast(1)运营商。

import { range, merge, Subject } from 'rxjs';
import { take, takeLast, multicast } from 'rxjs/operators';

range(1, 10)
  .pipe(
    multicast(() => new Subject(), o => merge(
      o.pipe(take(1)),
      o.pipe(takeLast(1)),
    )),
  )
  .subscribe(v => console.log('result', v));

在您的情况下，您似乎可以执行以下操作，但我不知道您的目标到底是什么:

down$
  .pipe(
    switchMap(() => move$.pipe(
      takeUntil(up$),
      multicast(() => new Subject(), o => merge(
        o.pipe(take(1)),
        o.pipe(takeLast(1)),
      )),
    )),
  )
  .subscribe(console.log);

看现场演示:https://stackblitz.com/edit/rxjs6-demo-ymjoiy?file=index.ts