移动端项目中,在滚动的时候,会报出以下提示:

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

解决

  1. touch的事件监听方法上绑定第三个参数{ passive: false }

    通过传递 passive 为 false 来明确告诉浏览器:事件处理程序调用 preventDefault 来阻止默认滑动行为。
target.addEventListener('touch', function () {

}, { passive: false });
  1. 在 CSS 中全局使用:
* {
touch-action: pan-y;
}

touch-action 的使用方法见:https://developer.mozilla.org/zh-CN/docs/Web/CSS/touch-action

参考:

https://juejin.im/post/5ad804c1f265da504547fe68

https://www.jianshu.com/p/04bf173826aa

移动端页面滑动时候警告: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 treated as passive.

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

  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. IScroll Unable to preventDefault inside passive event listener due to target being treated as passive

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

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

  5. 滑动报 Unable to preventDefault inside passive event listener due to target being treated as passive 的解决方法

    google浏览器滑动出现以下问题: 解决办法如下:在html元素下添加样式 touch-action: none; html{ touch-action:none; }

  6. Vue移动端报错[Intervention] Unable to preventDefault inside passive event listener due to target being treated as passive.

    解决方法如下 项目方案: 在最外侧添加样式操作 .

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

    使用滚动时候,新版google浏览器,会弹出如下的警告. 解决方法,可以加上* { touch-action: none; } 这句样式去掉. 其原因:https://developers.googl ...

  8. 关于Google浏览器Unable to preventDefault inside passive event listener due to target being treated as passive.的解决方案

    最近写react项目的时候,引用了antd-mobile,在使用滚动组件的时候,发现谷歌浏览器会报以下警告 最初我以为是antd-mobile的问题导致的,然后我就无查看了之前的vue的项目,发现了类 ...

  9. Unable to preventDefault inside passive event listener due to target being treated as passive 怎么办?

    本篇为转载,原文链接:https://blog.csdn.net/lijingshan34/article/details/88350456 翻译一下:chrome 监听touch类事件报错:无法被动 ...

随机推荐

  1. 数据库小组与UI小组第一次对接

    时间:2018.6.1,21:30 ~ 23:00 人员:除黄志鹏外全体成员,因为黄志鹏临时有事 工作内容: 主要为数据库小组与UI第二组对接,并将成果汇总到github仓库.另外UI第一组重构了代码 ...

  2. ASA 用TFTP 备份配置方法

    一种方法是用ASDM,在菜单样哪项里有一个backup,保存为一个压缩文件rar,恢复也是用ASDM.另一种是用TFTP SERVER 来做,电脑用网线接上ASA,还要把cisco TFTP SERV ...

  3. Amazon Redshift数据库

    Amazon Redshift介绍 Amazon Redshift是一种可轻松扩展的完全托管型PB级数据仓库,它通过使用列存储技术和并行化多个节点的查询来提供快速的查询性能,使您能够更高效的分析现有数 ...

  4. 内网DHCP攻击

    局域网内DHCP攻击 实验环境:两个win2008 r2虚拟机(一台用作正常的DHCP服务器,另一台用作伪造DHCP服务器),两个win7虚拟机(用作客户机),一个kali虚拟机(用作攻击,耗尽DHC ...

  5. js常见执行方法window.onload = function (){},$(document).ready()

    1. window.onload = function(){}; 当页面DOM对象加载完毕,web浏览器能够运行JS时,此方法即被触发. 2. $(document).ready();当web页面以及 ...

  6. sql点滴—mysql中查询表的信息

    mysql中查询表的信息 查询mysql表字段信息的sql语句 SHOW DATABASES //列出 MySQL Server 数据库. SHOW TABLES [FROM db_name] //列 ...

  7. ArcGIS API for Javascript之专题图的制作(四)热力图渲染(上)

    一 .热力图定义 热力图(heat map)也称热图,是以特殊颜色高亮区域的形式表示密度.温度.气压.频率等分布的不易理解和表达的数据. 二.HeatmapRenderer esri/renderer ...

  8. 「2017 山东一轮集训 Day5」字符串

    题目 比较神仙的操作啊 首先先考虑一个串的做法,我们有两种:SA或SAM,其中SAM又有两种,拓扑图上的\(dp\)和\(parent\)上随便统计一下 显然这道题\(SA\)和\(parent\)树 ...

  9. 【转】ajax 跨域 headers JavaScript ajax 跨域请求 +设置headers 实践

    解决跨域调用服务并设置headers 主要的解决方法需要通过服务器端设置响应头.正确响应options请求,正确设置 JavaScript端需要设置的headers信息 方能实现. 此处手札 供后人参 ...

  10. Dig命令解析结果

    dig -t RT NAME @NS -t RT 指定要查询的资源记录类型 NAME 需要解析的域(域名) @NS 指定那个域名服务器负责解析 [root@xss ~]# dig www.ihoney ...