最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

浏览器告警提示:Added non-passive event listener to a scroll-blocking ‘touchstart‘ event. Consider markin...

运维笔记admin2浏览0评论

超烦有没有,触发一次事件它就提示一次,洁癖的我今天就告诉你们怎么处理掉这个问题。

问题:

vue3项目中使用Element-Plus的表单form校验单的时候,浏览器出现以下警告:

[Violation] Added non-passive event listener to a scroll-blocking ‘touchmove’ event. 
Consider marking event handler as ‘passive’ to make the page more responsive.

我个人不喜欢控制台有任何告警和报错,所以有我一定要解决。尽管告警不会直接影响项目运行出现报错 ,但是这系列警告的存在就会为以后项目运行出现未知问题埋下隐患。

解决方案:

原因:项目没有添加事件管理者’passive’,而在谷歌浏览器里面 Chrome51 版本以后,Chrome 增加了新的事件捕获机制Passive Event Listeners ,当前仅支持mousewheel/touch相关事件,目前Chrome主要利用该特性来优化页面的滑动性能。所以这里的解决方案是:安装default-passive-events插件。

安装插件
npm install default-passive-events -S 
在main.js引入
import 'default-passive-events'

就这简单两步,让你的浏览器console干净一新。

与本文相关的文章

发布评论

评论列表(0)

  1. 暂无评论