Passive Event Listeners是Chrome提出的一个新的浏览器特性:
-
Web开发者通过一个新的属性passive来告诉浏览器,当前页面内注册的事件监听器内部是否会调用preventDefault函数来阻止事件的默认行为,以便浏览器根据这个信息更好地做出决策来优化页面性能。当属性passive的值为true的时候,代表该监听器内部不会调用preventDefault函数来阻止默认滑动行为,Chrome浏览器称这类型的监听器为被动(passive)监听器。
目前Chrome主要利用该特性来优化页面的滑动性能,所以Passive Event Listeners特性当前仅支持mousewheel/touch相关事件。 -
出现这种情况估计是你点击页面的时候,触发了touch事件,而touch事件默认的passive是true,但是对应的touch事件中又使用了preventDefault, 所以会触发这个错误。
可以在touch的事件监听方法上绑定第三个参数{ passive: false }, 通过传递 passive 为 false 来明确告诉浏览器:事件处理程序调用 preventDefault 来阻止默认滑动行为。
target.addEventListener(event, handler, false)
可以看这个文章解释
但是我这次遇到的警告是因为引用zepto这个插件,滑动页面的时候警告
Unable to preventDefault inside passive event listener due to target being treated as passive
可以加样式解决
* { touch-action: pan-y; }
网友评论