前端滚动警告Unable to preventDefault inside passive event listener due to target being treated as passive.

最新推荐文章于 2024-08-16 08:11:46 发布
最新推荐文章于 2024-08-16 08:11:46 发布
阅读量689 收藏
点赞数
分类专栏： problem
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_39331257/article/details/118569532
版权
  • 正常情况下，浏览器要在执行事件处理函数之后才知道是否调用preventDefault()阻止默认事件，这就导致了浏览器响应滑动有延迟。从chrome56开始，在 window、document 和 body 上注册的 touchstart 和 touchmove 事件处理函数，会默认为是 passive: true。
  • 翻找发现是日历组件vue-hash-calendar中TimePicker组件存在e.preventDefault() 且项目中安装了依赖 default-passive-events
  • 没找到更优雅的解决办法，毕竟组件在node_modules中不好改，在项目中body{ touch-action: none;}并未生效，只能暂时npm uninstall default-passive-events解决
白执落
关注
专栏目录
default-passive-events:使{被动
05-02
default-passive-events 当支持EventListenerOptions时，默认使{passive：true} 50行代码段，默认情况下启用某些事件的（）。 基本上，每次您声明新的时，它都会自动设置{Passive：true} 。 安装 yarn add default-passive-events 用法 只需提供包装： require ( 'default-passive-events' ) ; 或将其包含在本地： < script type =" text/javascript " src =" node_modules/default-passive-events/dist/index.js " > </ script > 或来自 ： < script type =" text/javascript " src =" https://unpkg.c
Unable to preventDefault inside passive event listener due to target being treated as passive
qq_49420571的博客
06-11 9792
"Unable to preventDefault inside passive event listener due to target being treated as passive." 这个错误通常是由于尝试阻止已被声明为被动的事件的默认行为所引起的。要解决这个问题，可以尝试以下方法： elem.addEventListener('touchstart', function(e) { e.preventDefault(); }, { passive: false }); 使用 { pas
default-passive-events 开源项目教程
最新发布
gitblog_00439的博客
08-16 963
default-passive-events 开源项目教程 default-passive-eventsMakes {passive: true} by default when EventListenerOptions are supported项目地址:https://gitcode.com/gh_mirrors/de/default-passive-events 1、项目介绍 defaul...
解决警告：Unable to preventDefault inside passive event listener due to target being treated as passive.
lizhihua0625的博客
03-09 7606
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 怎么办？
热门推荐
景山编程-顺道编程
03-08 18万+
翻译一下：chrome 监听touch类事件报错：无法被动侦听事件preventDefault，是新版本chrome 浏览器报错。 说明：说一下这个 preventDefault()是个什么鬼，这个是取消默认事件的，如果这个函数起作用的，比如默认的表单提交，a链接的点击跳转，就不好用了。 原因：google浏览器为了最快速的相应touch事件，做出的改变。 历史：当浏览器首先对默认的事件进行响应的...
解决Unable to preventDefault inside passive event listener invocation 报错问题
weixin_40716786的博客
05-29 4万+
问题描述：项目里使用echarts滚动事件在chrome里报错Unable to preventDefault inside passive event listener invocation 由于浏览器必须要在执行事件处理函数之后，才能知道有没有掉用过 preventDefault() ，这就导致了浏览器不能及时响应滚动，略有延迟。 所以为了让页面滚动的效果如丝般顺滑，从 chrom...
大图片所引起的内存问题
10-29
然而，这种做法在处理大量或大尺寸图片时，可能导致内存缓存积累过多，尤其是在像Gallery这样的滚动视图中，每个Item都有可能被缓存，即使它们已经不在屏幕范围内，这就会加剧内存消耗。 解决大图片内存问题，通常...
网页右键ie不支持event.preventDefault和event.returnValue （需要加window）
09-05
在大部分现代浏览器中，我们可以使用`event.preventDefault()`方法来实现这一功能，然而，对于古老的Internet Explorer（IE）浏览器，情况就有所不同了。本文将详细讲解在IE浏览器中如何阻止右键点击的默认行为以及`...
Passive Event Listeners - 被动事件监听器1
08-08
被动事件监听器（Passive Event Listeners）是现代Web开发中的一个重要优化策略，尤其是在构建高性能的Web应用程序时。这个概念的引入主要是为了提高页面的滚动性能和响应速度，特别是对于移动设备上的触摸事件。...
flex中event.preventDefault()方法取消事件的默认行为
10-27
在Flex编程中，`event.preventDefault()`方法是一个非常关键的事件处理机制，用于阻止事件的默认行为。这个方法常被用于监听和响应用户交互时，控制应用程序的行为。在给定的例子中，我们看到它被应用于一个名为`...
ng-event-options:在角度模板中启用事件选项（捕获，被动，...）
05-14
stopImmediatePropagation ， stopPropagation和preventDefault其他事件选项 事件操作员对throttle和debounce支持 用于在NgZone外部NgZone并且仅在platformBrowser内部绑定的角度事件选项 该模块仅压缩3KB ，因此...
关于chrome56版本后，页面滚动事件preventDefault()失效，并报错：Unable to preventDefault inside
源林氏的笔记本
07-16 1119
最近在写自定也页面组件时，有一个需要阻止鼠标滚轮滚动事件的需求，发现在chrome75.0，阻止默认事件的e.preventDefault(); wheelEvent:function(e) { e = e || window.event; if(e.preventDefault) { ...
解决Unable to preventDefault inside passive event listener invocation.报错
qq_39877681的博客
11-29 973
解决Unable to preventDefault inside passive event listener invocation.报错
vue解决报错Unable to preventDefault inside passive event listener invocation.
m0_73481765的博客
10-18 5879
然而，在passive事件监听器中调用preventDefault()方法是无效的，并且会引发上述警告。而passive事件监听器是一种新的事件处理机制，它允许开发者在事件处理函数执行之前告诉浏览器不要等待事件处理函数执行完毕就可以继续执行默认的操作，这样可以提高页面的响应性能。然而，在某些情况下，忽视这个警告可能会导致意外的行为或性能问题，所以建议开发者根据具体情况选择合适的解决方案。使用事件委托：如果无法直接在Vue组件中解决该警告，可以尝试在父级元素上使用事件委托，并在事件处理函数中调用。
“填坑”之解决Unable to preventDefault inside passive event listener invocation.
m0_46074266的博客
02-06 8957
Unable to preventDefault inside passive event listener invocation.
Vue使用echart报错“Unable to preventDefault inside passive event listener invocation”
qq_39548550的博客
06-06 4461
今天，2022-06-06，被封了一个月，端午来公司上班第一天。今天在项目中碰到了一个棘手的问题，vue项目中使用echart，使用echart的dataZoom组件进行图表缩放的时候报错，“Unable to preventDefault inside passive event listener invocation”。...
Unable to preventDefault inside passive event listener invocation报错
weixin_44846945的博客
11-09 5725
Unable to preventDefault inside passive event listener invocation报错解决方案
解决Unable to preventDefault inside passive event listener invocation. 报错
m0_59006402的博客
05-08 1253
解决办法：将 main.js中引入的：import 'default-passive-events' 注释掉。这个报错大致说的是 阻止默认行为。
谷歌浏览器关于滚动事件警告去除
weixin_49295874的博客
02-16 1888
将非被动事件侦听器添加到滚动阻止“鼠标滚轮”事件。考虑将事件处理程序标记为“被动”以使页更具响应性。2、main.js中加入：import ‘default-passive-events’
Unable to preventDefault inside passive event listener due to target being treated as passive.
07-24
"Unable to preventDefault inside passive event listener due to target being treated as passive" 这是一个错误消息，通常出现在使用 React 或类似库的 JavaScript 程序中，当你尝试在一个被动事件监听器中阻止...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值