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 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的更多相关文章
- [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() ...
- 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 今天在做项目 ...
- Unable to preventDefault inside passive event listener
最近做项目经常在 chrome 的控制台看到如下提示: Unable to preventDefault inside passive event listener due to target bei ...
- 滑动时候警告:Unable to preventDefault inside passive event listener
1 前言 在制作2048时,需要在手机端添加滑动检测事件,然后发现控制台有警告,如下: main2048.js:218 [Intervention] Unable to preventDefault ...
- 移动端页面滑动时候警告:Unable to preventDefault inside passive event listener due to target being treated as passive.
移动端项目中,在滚动的时候,会报出以下提示: [Intervention] Unable to preventDefault inside passive event listener due to ...
- [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 ...
- IScroll Unable to preventDefault inside passive event listener due to target being treated as passive
最近两天企业微信下IScroll突然无法滚动了,特别慢,之前好好的,发现主要是有红色的Unable to preventDefault inside passive event listener du ...
- 引用fastclick.js或使用触屏监听 滑动屏幕报错:解决[Intervention] Unable to preventDefault inside passive event listener
使用fastClick.js所产生的一些问题 开发h5活动页时想到移动端会有300ms的延迟,于是便打算用fastClick.js解决. 页面引入fastClick.js后,滑动H5页面的时候发现谷歌 ...
- Android事件监听器Event Listener
在 Android 中,我们可以通过事件处理使UI与用户互动(UI Events). UI的用户事件处理,即View处理用户的操作,在应用程序中几乎不可避免.View是重要的类,它是与用户互动的前线: ...
随机推荐
- 假期学习【六】Python网络爬虫2020.2.4
今天通过Python网络爬虫视频复习了一下以前初学的网络爬虫,了解了网络爬虫的相关规范. 案例:京东的Robots协议 https://www.jd.com/robots.txt 说明可以爬虫的范围 ...
- gulp安装报错Local version: Unknown
解决方法 使用国内的淘宝镜像安装: cnpm install -g gulp 一开始只执行了上面命令,没执行下面,gulp -v 之后显示Local version: Unknowncnpm inst ...
- AntDesign(React)学习-1 创建环境
目录: AntDesign(React)学习-15 组件定义.connect.interface AntDesign(React)学习-14 使用UMI提供的antd模板 AntDesign(Reac ...
- linux常用命令和字符串乱码
top :动态实时显示cpu.内存.进程等使用情况(类似windows下的任务管理器) ps aux 查看所有进程 ps aux|grep java 查看java进程 kill -9 进程号 :强制杀 ...
- react中用swiper实现大图功能
1.引入Swiper(用的是4.5.0版本) import Swiper from 'swiper'; //引入样式,还可以加上自己的样式 import '../../s ...
- DM642学习:CMD、GEL文件
在建立ccs工程的时候,cmd文件和gel文件非常重要,如不能配置好会出现一些莫名其妙的问题. 1. CMD文件: 不同的DSP芯片内集成的存储器大小各异,但其配置方式是类似的.大家可通过查阅DSP芯 ...
- too old
The working copy at “” is too old (format 10) to work with client version ‘1.9.7(r18000392)’ 原因:svn版 ...
- mac环境下,pycharm2018 配置 anaconda。
2018版的pycharm与之前的版本在配置anaconda上流程略有不同.直接上图 1.新建工程,展开会看到系统默认的编译环境名叫virtualenv,是基于python3.5的环境(如果没有安装过 ...
- 剑指offer 面试题56. 数组中只出现一次的两个数字
题目描述 一个整型数组里除了两个数字之外,其他的数字都出现了两次.请写程序找出这两个只出现一次的数字. 方法1:用set记录出现过的数字 class Solution { public: void F ...
- Vue的iview组件框架select远程搜索,选中后不刷新的问题
1.场景:弹框内有一个下拉组件(支持搜索),当选择完数据后弹框关闭,再次打开后,下拉框内的数据是刚才选中的数据.原因:分析后觉得是搜索内容没有清空,导致下拉的数据只有一个 2.解决方案 a .解决:调 ...