首页 > 解决方案 > 为什么水龙头运营商会影响水流?

问题描述

由于某种原因,有一个点击运算符正在改变流的输出(实际上提供了我的预期结果)。当我移除水龙头时,后续过滤器似乎不再起作用。

我已经在codesandbox上运行了下面的代码

  tap(([prevMouseEvent, currentMouseEvent]) =>
    console.log(directionChange(prevMouseEvent, currentMouseEvent))
  ),

包括以及注释掉。如果没有点击,后续过滤器似乎不起作用,并且我得到一个恒定的配对鼠标事件流。

// Returns true if the predominant movement in the mouse has changed direction
  const directionChange = (prevMouseEvent, currentMouseEvent) => {
     const dominantAxisMovement =
       Math.abs(currentMouseEvent.movementX) >
       Math.abs(currentMouseEvent.movementY) ? "X" : "Y";

     if (dominantAxisMovement === "X") {
       return (
         Math.sign(currentMouseEvent.movementX) !==
         Math.sign(prevMouseEvent.movementX)
       );
     } else {
       return (
         Math.sign(currentMouseEvent.movementY) !==
         Math.sign(prevMouseEvent.movementY)
       );
    }
};

const mouseDirectionSwitch$ = fromEvent(document, "mousemove").pipe(
  pairwise(),
  tap(([prevMouseEvent, currentMouseEvent]) =>
    console.log(directionChange(prevMouseEvent, currentMouseEvent))
  ),
  filter(([prevMouseEvent, currentMouseEvent]) =>
    directionChange(prevMouseEvent, currentMouseEvent)
  )
);

mouseDirectionSwitch$.subscribe(passed => console.log(passed));

我想要实现的是一个 observable,它只在用户改变鼠标移动的方向时发出(我所说的改变移动是指从上到下和从左到右,而不是细微的变化)。使用水龙头它可以工作,但是任何人都可以解释为什么这里需要水龙头操作符来获得所需的输出吗?我认为 tap 运算符返回了一个相同的 observable,因此不会影响它所在的​​流的输出。

标签: javascriptrxjsrxjs6

解决方案


感谢您的建议。雅各布 - 你的建议让我去在它自己的独立项目中重新创建它......它工作得很好。所以我关闭了所有东西,重新打开了原来的项目,结果发现它起作用了。我真的不确定为什么它以前不起作用(尽管刷新了整页以刷新任何剩余的事件处理程序)但古老的“你是否尝试过重新启动计算机”是我真正需要的。谢谢你的想法!


推荐阅读