Vue控制台警告:  Added non-passive event listener to a scroll-blocking 'touchmove' 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'

参考了:https://blog.csdn.net/dj0379/article/details/52883315
————————————————
版权声明:本文为CSDN博主「羊羊羊92」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/weixin_40716786/article/details/90045802

Added non-passive event listener to a scroll-blocking 'touchmove' event. Consider marking event handler as 'passive' to make the page more responsive的更多相关文章

  1. [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() ...

  2. 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 今天在做项目 ...

  3. Unable to preventDefault inside passive event listener

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

  4. 滑动时候警告:Unable to preventDefault inside passive event listener

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

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

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

  6. [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 ...

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

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

  8. 引用fastclick.js或使用触屏监听 滑动屏幕报错:解决[Intervention] Unable to preventDefault inside passive event listener

    使用fastClick.js所产生的一些问题 开发h5活动页时想到移动端会有300ms的延迟,于是便打算用fastClick.js解决. 页面引入fastClick.js后,滑动H5页面的时候发现谷歌 ...

  9. Android事件监听器Event Listener

    在 Android 中,我们可以通过事件处理使UI与用户互动(UI Events). UI的用户事件处理,即View处理用户的操作,在应用程序中几乎不可避免.View是重要的类,它是与用户互动的前线: ...

随机推荐

  1. XSS进阶学习-转载

    在这篇帖子里面真的可以学到很多xss的知识,特别有过xss基础的看完这个贴子绝对有帮助: 就像里面的师傅所说,看了一篇精髓文章之后,自己xss的功力突飞猛进了. 所提到的帖子入口:https://mp ...

  2. 2018ICPC南京站Problem G. Pyramid

    题意: 找有多少个等边三角形 解析: 首先打标找规律,然后对式子求差分 0,1,5,15,35,70,126,210... 1,4,10,20,35,56... 3,6,10,15,21... 3,4 ...

  3. java 类型判断

    //java 类型匹配测试 Circle circle = new Circle(); // circle rectangle 实现了 shape System.out.println(circle ...

  4. 打包Windowsform项目出现File 'Cognex.VisionPro3D.dll' targeting 'AMD64' is not compatible with the project's target platform 'x86'错误

    错误信息: 个人理解此错误的大概意思是:打包的文件是64位的但是打包后的文件设置的是32位的,就出现冲突了. 解决方案:选择打包程序项目的属性窗口设置TargetPlatform属性为对应的值,本项目 ...

  5. 解决pjax重复加载js导致事件重复绑定的问题

    个人博客 地址:http://www.wenhaofan.com/article/20180925232057 1.所有js统一在pjax容器外引入 在pjax容器外引入的js只会被引入一次,所以不会 ...

  6. IDEA工具java开发之 运行与调试

    一.运行项目 ◆右键运行 ◆菜单运行 ◆run窗口运行 ◆启动参数 作用:经常用在本地开发环境要去连测试的数据库的时候使用.正常的情况下是连开发环境的数据库的,但是有些情况是需要连测试数据库的.所以这 ...

  7. dev、test、pre和prod是什么意思?

      开发环境(dev):开发环境是程序猿们专门用于开发的服务器,配置可以比较随意,为了开发调试方便,一般打开全部错误报告.   测试环境(test):一般是克隆一份生产环境的配置,一个程序在测试环境工 ...

  8. 电脑进不去BIOS解决办法

    把所有外设(主要是硬盘,包括装在主板上的固态硬盘)拆下来,拆下纽扣电池给主板放电,装回纽扣电池,重启F1进入BIOS. 最终查到原因,是固态那里出的问题,固态作为启动硬盘,被自己搞得有问题了,有两个启 ...

  9. Ajax返回值一直获取不到啊

      原理: 同步异步的问题 Return 位置的问题     首先同步异步改为async : false,   Return 的值写在ajax外部  function submit_answer(){ ...

  10. C++-new 的六种重载形式

    当写出这样的代码的时候, 实际上有两步操作: p = new P(); 1.分配内存, 2.然后在分配好的内存之上初始化类成员. 第二步是有构造函数完成的, 第一步就是new函数的工作. 全局的new ...