在rxjs中,如何从takeUntil结束的switchMap中获取最后一个值?

在rxjs中,如何从takeUntil结束的switchMap中获取最后一个值?,rxjs,Rxjs,下面是一个典型的rxjs拖放示例: const drag$ = mousedown$.pipe( switchMap( (start) => { return mousemove$.pipe(map(move => { move.preventDefault(); return { left: move.clientX - start.offsetX, top: move.clientY

下面是一个典型的rxjs拖放示例:

const drag$ = mousedown$.pipe(
  switchMap(
    (start) => {
      return mousemove$.pipe(map(move => {
        move.preventDefault();
        return {
          left: move.clientX - start.offsetX,
          top: move.clientY - start.offsetY
        }
      }),
        takeUntil(mouseup$));
    }));

drag$.subscribe(pos => {
  box.style.top = `${pos.top}px`
  box.style.left = `${pos.left}px`
});
takeUntil
将取消订阅mouseMove$的内部可观察内容。但是,如果我需要内部可观察的最后一个值,以便在鼠标上对其进行处理,该怎么办?我知道我可以给一个全局临时变量赋值,以达到这个目的,但我正试图避免这种情况

我试图做的更复杂的事情是:

我正在做一个3D游戏,我想实现抓取和投掷。我将其设置为类似于rxjs conanical拖放场景,在该场景中,我订阅一个控制器“挤压”事件,然后
切换到另一个可观察到的控制器移动,在该场景中,我“拖动”并将对象重新定位到我手的任何位置,最后我
直到释放“挤压”为止,让物体离开

但是还有一件事我需要去实现“扔”这个物体,那就是我需要我的手运动的速度向量,在挤压被释放的那一刻,向这个物体施加一个脉冲力,当我放开它的时候,它就会飞走。可以使用
scan
switchMap
管道中的每一帧上计算该向量

问题是,
take直到
刚刚停止数据流,并且我无法访问
scan
累加器中的最后一个值。您可以使用该操作符从另一个可观察对象获取最近的发射。结果是流值的数组,后面是其他可观察对象的最后一次发射:


下面是一个示例。

这是一个非常有趣的问题,我猜在发生
拖动事件时,您还需要这些值,但也需要在
鼠标移动事件发生之前最后发出的值

我认为一种方法是:

const drag$=mousedown$.pipe(
开关图(
(开始)=>{
mousemove$=mousemove$.pipe(
地图(移动=>{
move.preventDefault();
返回{
左:move.clientX-start.offsetX,
顶部:move.clientY-start.offsetY
}
}),
takeUntil(mouseup$),
share(),
);
返回海螺(
//在“mousemove”事件发生时获取它们
mousemove$,
mousemove$.pipe(
减少((acc,crt)=>{/*…*/}),
),
)
}));
reduce
运算符的工作原理与
scan
相同,但前者在源完成时将发出累积值

如果您想在两个观察对象中使用相同的
扫描
逻辑,那么
开关映射
的内部观察对象可以如下所示:

mousemove$=mousemove$.pipe(
地图(移动=>{
move.preventDefault();
返回{
左:move.clientX-start.offsetX,
顶部:move.clientY-start.offsetY
}
}),
扫描((acc,crt)=>{/*…*/}),
takeUntil(mouseup$),
share(),
);
返回海螺(
mousemove$,
mousemove$.pipe(
//当源完成时,它将发出最后发出的值
takeLast(1),
),
)
mouseup$.pipe(
  withLatestFrom(drag$)
).subscribe(
  ([mouseup, drag]) => console.log({drag, mouseup})
);