笔记:记录一次移动端报错[Intervention]的解决方法+touch-action属性

597 阅读1分钟

今天用原生写了一个移动端的页面,在写省市区三级联动的时候,报了一个错。

如图所示,虽然写的效果出来了,也可以正常使用,但是上下划动时却报了一个不明白的错。
报的错直译为:[干预]无法防止被动事件侦听器内的默认值,因为目标被视为被动。请参见<URL>
虽然没懂,但还是查阅了资料寻求解决办法


解决办法

在css样式中加入
*{
   touch-action: pan-y; 
 }

就好了。


touch-action是css3的属性,作用是给指定的区域是否允许操作,以及如何响应操作(比如浏览器自带的划动、缩放等)。
其值有:
touch-action: auto;   //(默认)当触控事件发生在元素上时,由浏览器来决定进行哪些操作。
touch-action: none;   //当触控事件发生在元素上时,不进行任何操作。
touch-action: pan-x;  //启用单指水平平移手势(左右滑动)。
touch-action: pan-y;  //启用单指垂直平移手势(上下滑动)。
touch-action: manipulation;  //只允许进行滚动和持续缩放操作。
touch-action: pan-left / pan-right / pan-up / pan-down;  //启用以指定方向滚动开始的单指手势。
touch-action: pinch-zoom;  //启用多手指平移和缩放页面。

该属性移动端用的较多。

学无止境!