前言

用element-plus搞项目的时候一直报下面这个警告, 主要是在用<el-table></el-table>的地方
想要知道关于警告详情的,可以参考博文下发的参考链接,我就不多赘述了

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

解决方法

方法一(安装default-passive-events)

先终端运行以下命令

npm install default-passive-events --save

再在main.js引入

import ‘default-passive-events’

这是网上的通用做法,但我没生效:(

方法二(修改element-plus源代码)

"element-plus": "1.0.2-beta.71"
先打开 node_modules/element-plus/es/directives/index.js文件
Ctrl+F搜索(const mousewheel)附近
在 const isFirefox下添加

const canPassive = typeof navigator !== "undefined" && ~~navigator.userAgent.toLowerCase().match(/chrome\/(\d.*?)\./)[1] > 51;

在if (isFirefox)下新增条件分支

else if (canPassive) {
      element.addEventListener("mousewheel", fn, {passive: true})
    } 

参考链接

参考链接1: 让页面滑动流畅得飞起的新特性：Passive Event Listeners.
参考链接2: chrome passive event listener 报错.