android - touchmove事件如何禁止页面滚动

Question

最近在H5页面上做了一个类似ios的 AssistiveTouch 的功能：一个悬浮的小挂件，可以在页面上移动，不用的时候自动贴边吸附。

出现的问题：

在Android手机上，移动小挂件的时候，页面会随之滚动。

因为 chrome浏览器为了提高页面滚动的流畅度，在新的chrome浏览器上，touchmove事件里不能用 event.preventDefault() 阻止页面滚动了。

新的绑定事件，需要这样处理 (加了一个 passive: false 属性)

document.addEventListener('click', onClick, {passive: false, capture: false});

但是我用的react,绑定监听直接用的

<p onTouchmove={::this.touchmove} >
</p>

touchmove 移动挂件的时候,怎么阻止页面滚动那？

Answer 1

直接来。资料在这里

您的事件处理程序将传递 SyntheticEvent 的实例，SyntheticEvent 是浏览器本机事件的跨浏览器包装器。它与浏览器的本机事件具有相同的接口，包括 stopPropagation() 和 PreventDefault()，但事件在所有浏览器中的工作方式相同。

如果您发现由于某种原因需要底层浏览器事件，只需使用nativeEvent属性即可获取。每个 SyntheticEvent 对象都具有以下属性：

雷雷