react中阻止事件冒泡的坑

解决方法：

使用原生的事件监控

function MyBody(props: any) {
  const ScrollRef = useCallback((node) => {
    if (!node) {
      return;
    }
    node.addEventListener("touchstart", onTouchStart);
    node.addEventListener("touchmove", onTouchMove);
  }, []);

  const onTouchStart = (e: any) => {
    startX = e.touches[0].pageX;
    startY = e.touches[0].pageY;
  };

  const onTouchMove = (e: any) => {
    moveEndX = e.touches[0].pageX;
    moveEndY = e.touches[0].pageY;
    const X = moveEndX - startX;
    const Y = moveEndY - startY;

    if (Math.abs(Y) > Math.abs(X) && Y > 0) {
      //从上往下滑，阻止事件冒泡
      e.stopPropagation();
    }
  };
 
  return (
    <div className="list-check-view" ref={ScrollRef}>
      {props.children}
    </div>
  );
}

参考链接：https://www.cnblogs.com/Wayou/p/react_event_issue.html