码迷,mamicode.com
首页 > 其他好文 > 详细

vue运行报错--preventDefault

时间:2018-10-27 18:46:56      阅读:393      评论:0      收藏:0      [点我收藏+]

标签:androi   0ms   监听   listener   add   style   .com   sid   链接   

[Intervention] Unable to preventDefault inside passive event listener due to target being treated as passive. See https://www.chromestatus.com/features/5093566007214080

解决方法:

方法一
在touch的事件监听方法上绑定第三个参数{ passive: false },
通过传递 passive 为 false 来明确告诉浏览器:事件处理程序调用 preventDefault 来阻止默认滑动行为。

elem.addEventListener(
  touchstart,
  fn,
  { passive: false }
);

方法二

 * { touch-action: pan-y; } 
 使用全局样式样式去掉

 

Passive event listeners

2016年Google I/O上提出的概念,目的是用来提升页面滑动的流畅度。

For instance, in Chrome for Android 80% of the touch events that block scrolling never actually prevent it. 10% of these events add more than 100ms of delay to the start of scrolling, and a catastrophic delay of at least 500ms occurs in 1% of scrolls.

在 Android 版 Chrome 浏览器的 touch 事件监听器的页面中,80% 的页面都不会调用 preventDefault 函数来阻止事件的默认行为。在滑动流畅度上,有 10% 的页面增加至少 100ms 的延迟,1% 的页面甚至增加 500ms 以上的延迟。

由于浏览器无法预先知道一个事件处理函数中会不会调用 preventDefault(),它需要等到事件处理函数执行完后,才能去执行默认行为,然而事件处理函数执行是要耗时的,这样一来就会导致页面卡顿,也就是说,当浏览器等待执行事件的默认行为时,大部分情况是白等了。

如果 Web 开发者能够提前告诉浏览器:“我不调用 preventDefault 函数来阻止事件事件行为”,那么浏览器就能快速生成事件,从而提升页面性能,Passive event listeners 的提出就解决了这样的问题。



原文链接:https://www.jianshu.com/p/04bf173826aa

 

vue运行报错--preventDefault

标签:androi   0ms   监听   listener   add   style   .com   sid   链接   

原文地址:https://www.cnblogs.com/vinieo/p/9862580.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!