Vue项目警告:[Violation] Added non-passive event listener to a scroll-blocking ‘wheel‘ event

vue项目警告:翻译default-passive-events给支持passive选项的事件处理器添加passive:true,这是chrome的一个特性,当属性passive的值为true的时候，代表该监听器内部不会调用preventDefault函数来阻止默认滑动行为,提高页面滑动性能部分源码:修改只给scroll,wheel事件添加passive:true...

qq_42372534

8122人浏览 · 2022-06-09 09:50:24

qq_42372534 · 2022-06-09 09:50:24 发布

vue项目警告:

runtime-dom.esm-bundler.js:300 [Violation] Added non-passive event
listener to a scroll-blocking ‘wheel’ event. Consider marking event
handler as ‘passive’ to make the page more responsive. See
https://www.chromestatus.com/feature/5745543795965952

翻译

[违规]将非被动事件侦听器添加到滚动阻止“轮子”事件。考虑将事件处理程序标记为“被动”，以使页面更具响应性。看见https://www.chromestatus.com/feature/5745543795965952

default-passive-events
给支持passive选项的事件处理器添加passive:true,这是chrome的一个特性,当属性passive的值为true的时候，代表该监听器内部不会调用preventDefault函数来阻止默认滑动行为,提高页面滑动性能

Makes {passive: true} by default when EventListenerOptions are supported

部分源码:
修改只给scroll,wheel事件添加passive:true

// const supportedPassiveTypes = [
//   'scroll', 'wheel',
//   'touchstart', 'touchmove', 'touchenter', 'touchend', 'touchleave',
//   'mouseout', 'mouseleave', 'mouseup', 'mousedown', 'mousemove', 'mouseenter', 'mousewheel', 'mouseover'
// ];

const supportedPassiveTypes = ['scroll', 'wheel']