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. include=FALSE的作用

    每次都会加载很多的包,会显示很多没用的信息,特别是那个spdep. 例如: {r include=FALSE} library(plm) library(tseries) library(zoo) l ...

  2. springboot项目集成activity

    1.按照上一篇博客,新建好springboot项目后,在项目pom.xml文件中添加activity依赖 <dependency> <groupId>org.activiti& ...

  3. Android Q 接入 MQTT

    Android Q 接入 MQTT 首先在APP 下引入mqtt的库 implementation 'org.eclipse.paho:org.eclipse.paho.client.mqttv3:1 ...

  4. linux - python - 异常:error while loading shared libraries

    问题描述 error while loading shared libraries: libpython2.7.so.1.0: cannot open shared object file: No s ...

  5. pymysql模块学习

    #Pymysql 用于连接mysql数据库 #连接数据库 data_ip = "192.168.34.128" data_name = "lch" data_p ...

  6. hibernate跟Mybatis/ ibatis 的区别,为什么选择?(转)

    第一章 Hibernate与MyBatisHibernate 是当前最流行的O/R mapping框架,它出身于sf.NET,现在已经成为Jboss的一部分. Mybatis 是另外一种优秀的O/R ...

  7. docker-部署zabbix4

    一.安装docker环境 安装依赖 yum install -y yum-utils device-mapper-persistent-data lvm2 设置yum源 yum-config-mana ...

  8. K3/Cloud树形单据体的rowId赋值

    RowId是树形单据体独有的,同一单据体中不能重复,用如下语句取. System.Guid.NewGuid().ToString() 同时FGROUP也需要重新设置,值可以和FSeq一样.

  9. [Codechef - ADITREE] Adi and the Tree - 树链剖分,线段树

    [Codechef - ADITREE] Adi and the Tree Description 树上每个节点有一个灯泡,开始所有灯泡都是熄灭的.每次操作给定两个数 \(a,b\) ,将 \(a,b ...

  10. 注解 - @Deprecated

    意思是说此方法已过时,过时的原因就是有新的API的类替代了次方法. 这个被划去的方法仍然是可以正常使用的,就是一个提示而已. Java内在的File类中有如下方法 @Deprecated public ...