在基于 Element-ui 写项目的时候，Chrome 提醒：

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

翻译过来如下：

违反：没有添加被动事件监听器来阻止'touchstart'事件，请考虑添加事件管理者'passive'，以使页面更加流畅。

原因是 Chrome51 版本以后，Chrome 增加了新的事件捕获机制－Passive Event Listeners；

Passive Event Listeners：就是告诉前页面内的事件监听器内部是否会调用preventDefault函数来阻止事件的默认行为，以便浏览器根据这个信息更好地做出决策来优化页面性能。当属性passive的值为true的时候，代表该监听器内部不会调用preventDefault函数来阻止默认滑动行为，Chrome浏览器称这类型的监听器为被动（passive）监听器。目前Chrome主要利用该特性来优化页面的滑动性能，所以Passive Event Listeners特性当前仅支持mousewheel/touch相关事件。

解决：

1、npm i default-passive-events -S

2、main.js中加入：import 'default-passive-events'

[Violation] Added non-passive event listener to a scroll-blocking 'mousewheel' event.的更多相关文章

  1. Added non-passive event listener to a scroll-blocking 'touchmove' event. Consider marking event handler as 'passive' to make the page more responsive

     Vue控制台警告:  Added non-passive event listener to a scroll-blocking 'touchmove' event. Consider markin ...

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

    相信如果用谷歌浏览器做移动端页面的时候 用touch事件的时候应该遇到过这个东东吧 documet.addEventListener("touchstart",function() ...

  3. vue中，解决chrome下，的warning, Added non-passive event listener to a scroll-blocking ‘mousewheel‘ event 问题

    写项目的时候,Chrome 提醒: [Violation] Added non-passive event listener to a scroll-blocking 'mousewheel' eve ...

  4. 设置点击事件时Unable to preventDefault inside passive event listener due to target being treated as passive

    问题 当使用fastClick.js设置点击事件时,控制台报错: [Intervention] Unable to preventDefault inside passive event listen ...

  5. Unable to preventDefault inside passive event listener due to target being treated as passive

    Unable to preventDefault inside passive event listener due to target being treated as passive 今天在做项目 ...

  6. Unable to preventDefault inside passive event listener

    最近做项目经常在 chrome 的控制台看到如下提示: Unable to preventDefault inside passive event listener due to target bei ...

  7. 滑动时候警告：Unable to preventDefault inside passive event listener

    1 前言 在制作2048时,需要在手机端添加滑动检测事件,然后发现控制台有警告,如下: main2048.js:218 [Intervention] Unable to preventDefault ...

  8. 移动端页面滑动时候警告：Unable to preventDefault inside passive event listener due to target being treated as passive.

    移动端项目中,在滚动的时候,会报出以下提示: [Intervention] Unable to preventDefault inside passive event listener due to ...

  9. [Intervention] Unable to preventDefault inside passive event listener due to target being treated as passive.

    1.滑动时候警告[Intervention] Unable to preventDefault inside passive event listener due to target being tr ...

  10. IScroll Unable to preventDefault inside passive event listener due to target being treated as passive

    最近两天企业微信下IScroll突然无法滚动了,特别慢,之前好好的,发现主要是有红色的Unable to preventDefault inside passive event listener du ...

随机推荐

  1. MVC控制器传值到JS

    1.传递整形数字 1 <script> 2 var data=@ViewBag.ID; 3 </script> 2.传递字符串 1 <script> 2 var d ...

  2. 技术Leader：像李云龙一样打造学习型团队

    今天跟大家分享一下怎么样构建一个学习型的团队. 首先对于计算机行业而言,不明而喻,我们要接受的东西真的太多了.我们接触的信息和变化也太多了.如果只是因循守旧,排斥新东西,那么我们被时代淘汰只是个时间问 ...

  3. 山海鲸Cesium：用更简单的方式升级视效

    CesiumJS作为绝大多数人都在用的开源地球可视化引擎,视觉效果并不拔尖,这让很多giser都想着有一天升级一下视效,从众多平庸的项目中脱颖而出.然而,对于一些使用Cesium的项目来说,要想达到C ...

  4. Windows系统激活工具HK

    下载:https://wwsi.lanzoum.com/iyUNn10e7foh 密码:g05d GitHub开源 .无毒 原文链接:https://github.com/zbezj/HEU_KMS_ ...

  5. 扩展中国剩余定理（Excrt）笔记

    扩展中国剩余定理(excrt) 本来应该先学中国剩余定理的.但是有了扩展中国剩余定理,朴素的 CRT 就没用了. 扩展中国剩余定理用来求解如下形式的同余方程组: \[\begin{cases} x \ ...

  6. UE5：相机震动CameraShake源码分析

    本文将会分析UE5中相机震动的调用流程,会简要地分析UCameraModifier_CameraShake.UCameraShakeBase等相关类的调用过程. 阅读本文,你至少需要使用或者了解过Ca ...

  7. CSS 基础 5 - CSS 选择器

    基础 #id{} ID 选择器 .class{} 类选择器 tag{} 标签选择器,tag 可以是 h1, p, div, span, img, nav, footer... *{} 通用选择器,选择 ...

  8. HDU 2144 Evolution 后缀树/后缀数组

    HDU 2144 Evolution 后缀树/后缀数组 题意 给我们不到一百个字符串(长度不到一百)以及一个百分比q,然后如果某两个字符串的最长公共子串占比超过了q(在两个串中都超过)则两个串为一个集 ...

  9. java中的数据库连接池

    常见的连接池的优缺点: HikariCP 优点: 性能出色,尤其在高并发负载下表现良好 内存消耗低,占用系统资源较少 具有自动化的连接池维护和统计功能 缺点: 需要 JDK7 或以上版本支持 配置选项 ...

  10. 【云小课】版本管理发展史之Git+——代码托管

    摘要:选择一款版本管理工具,已经被大多数企业作为项目的必要准备工作之一,相信没有一个开发者没有听过Git.SVN这些工具. 今天我们来寻根溯源,扒一扒版本管理的发展史. 版本管理工具之于软件开发,犹如 ...