Vue项目里怎么阻止touchmove事件的默认行为？

Question

今天写一个移动端页面，用到一个弹出的下拉框，而且下拉框里的内容是可以滚动的。问题是在滚动下拉框的时候，底层的body也会跟着滚动。网上查了查方法，其中一种是在下拉框上绑定@touchmove.prevent来取消事件的默认行为。但是实际使用的时候，用chrome调试发现控制台报错，提示不能取消passive值为true事件的默认行为。请问大家有什么好的解决办法吗？vue是不是只能通过.passive事件修饰符将其值设置为true，却不能把passive默认值从true改成false？难道只能用原生js绑定事件设置passive值吗？

Answer 1

有个办法是设置 html 样式为

overflow: hidden;
height: 100%;
position: fixed; 

可阻止穿透行为、ios的弹性滚动

Answer 2

阻止冒泡就行了啊

Answer 3

看了楼上的回答，觉得确实使用js去控制会比较麻烦且存在兼容性问题。

可以直接通过css overflow:hidden与否来解决会更好一点。

Answer 4

passive是addeventEvent第三个参数，可以优化手机端滚动。
passive为true，就是在注册的时候就告诉浏览器，不阻止浏览器的默认事件，所以这时候你注册的事件里面尝试阻止浏览器默认事件，那么控制台会报错。
某些浏览器（特别是Chrome和Firefox）已将touchstart和touchmove事件的passive选项的默认值更改为true。所以这时候你也别去preventDefault