vue-admin-elem对接地图报错Unable to preventDefault inside passive event listener invocation.

最新推荐文章于 2024-04-12 10:51:19 发布
最新推荐文章于 2024-04-12 10:51:19 发布
阅读量2.5k 收藏 6
点赞数 7
分类专栏： vueAdmin
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/HandsomeGuy_/article/details/108083889
版权

问题：

我的项目对接的地图每次鼠标点击、移入移出都会报
Unable to preventDefault inside passive event listener invocation.
不管是对接什么地图都会报错

原因

之前为了忽略警告滚动安装了一个default-passive-events依赖

解决方法

卸载相关依赖
npm uninstall default-passive-events

这个问题鳖了我2天了 真恶心

有相关问题的可以参考

小龍
关注
  • 7
    点赞
  • 踩
  • 6
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 19
    评论
专栏目录
vue2/3 - Unable to preventDefault inside passive event listener due to target being treated as passi
高级前端工程师
12-26 2493
vue，vue2 3报错解决，vue控制台报错如何解决，vue2报错警告怎么解决，vue3报错，浏览器控制台报错Unable to preventDefault inside passive event listener due to target being treated as passi完美解决方案方法，报错怎么办，报错解决，vue2/3 - Unable to preventDefault inside passive event listener due to target being treat
vue 解决chrome下的passive警告问题
weixin_44382108的博客
03-16 1004
vue 解决chrome下的passive警告问题
Unable to preventDefault inside passive event listener invocation报错
weixin_44846945的博客
11-09 5656
Unable to preventDefault inside passive event listener invocation报错解决方案
vue解决报错Unable to preventDefault inside passive event listener invocation.
m0_73481765的博客
10-18 5828
然而，在passive事件监听器中调用preventDefault()方法是无效的，并且会引发上述警告。而passive事件监听器是一种新的事件处理机制，它允许开发者在事件处理函数执行之前告诉浏览器不要等待事件处理函数执行完毕就可以继续执行默认的操作，这样可以提高页面的响应性能。然而，在某些情况下，忽视这个警告可能会导致意外的行为或性能问题，所以建议开发者根据具体情况选择合适的解决方案。使用事件委托：如果无法直接在Vue组件中解决该警告，可以尝试在父级元素上使用事件委托，并在事件处理函数中调用。
Vue使用echart报错“Unable to preventDefault inside passive event listener invocation”
qq_39548550的博客
06-06 4448
今天，2022-06-06，被封了一个月，端午来公司上班第一天。今天在项目中碰到了一个棘手的问题，vue项目中使用echart，使用echart的dataZoom组件进行图表缩放的时候报错，“Unable to preventDefault inside passive event listener invocation”。...
Vue3 Unable to preventDefault inside passive event listener invocation.报错解决
lllnana
12-14 1013
本次是因为在使用日期选择el-date-picker中谷歌浏览器中报错，但是又不影响使用，可是强迫症会觉得不舒服，查询了各种解决方案并尝试之后，发现这个方式解决是最好的。这种方案的解决思路是调整事件对象addEventListener的原型，通过该解决方式处理之后，谷歌浏览器不再报警告信息，也不会再引发新的错误。其实不仅仅是这个错误，很多同类型错误都可以使用这个方案解决，比如echar，还有elementPlus中输入框，日期选择，等等。
vue使用Cytoscape.js报错：“Unable to preventDefault inside passive event listener invocation“
weixin_46939955的博客
01-28 901
vue使用Cytoscape.js报错："Unable to preventDefault inside passive event listener invocation"问题解决方式 问题 在页面上使用Cytoscape.js，报错如图： 解决该问题的方法网上有两个，如果你采用网上的方法无效，不妨看看这个。 因为我下载了“default-passive-events”这个依赖，导致报错，若你也下载了，可能你的情况和我一样。 解决方式 npm uninstall default-passive-even
大图片所引起的内存问题
10-29
在Android开发中，内存管理是至关重要的，尤其是处理大图片时，可能会引发内存溢出（Out Of Memory，简称OOM）问题。这是因为Android设备为每个应用分配的内存是有限的，而大图片会占用大量内存，当应用试图加载过多...
安装运行vue-element-admin的报错问题-解决办法
热门推荐
qq_42376600的博客
11-20 1万+
安装运行vue-element-admin的报错问题 解决办法
【Vue3】解决element ui plus “Added non-passive event listener to a scroll-blocking ‘mousewheel‘ event.”
woodwhale的博客
04-06 2291
【Vue3】解决element ui plus “Added non-passive event listener to a scroll-blocking ‘mousewheel‘ event.” 如图，直接改element ui plus的源码 第一步： import { isClient } from '@vueuse/core'; const isFirefox = () => isClient && /firefox/i.test(window.navigator.use
vue - 使用百度地图vue-baidu-map插件动态刷新地图后报错（调用handler()方法报错：Error in y-on handler: “TypeError: Cannot read）
高级前端工程师
01-02 3443
vue，vue-baidu-map，百度地图，动态刷新地图点位，vue中使用百度地图vue-baidu-map刷新数据，vue-baidu-map覆盖层不动态刷新问题，如何让地图根据数据变动自动更新，Vue-baidu-map 动态刷新地图的方法，解决vue2百度地图的实时更新问题，Vue-baidu-map怎么手动更新地图数据，vue百度地图插件Vue-baidu-map如何更新动态地图数据，vue.js集成百度地图插件vue-baidu-map，Vue-baidu-map刷新api，解决Vue baid
vue3.0+antd中select选择报错： Unable to preventDefault inside passive event listener invocation.出现的问题。
Mr_xiaopang19的博客
09-02 2176
1. 错误 在使用在vue3.0项目中使用antd的select组件时，选择状态时 报错： 2.原因： 谷歌浏览器报vue项目的错[Intervention] Unable to preventDefault inside passive event listener due to target being treated as passive，是因为：chrome 监听touch类事件报错：无法被动侦听事件preventDefault，是新版本chrome 浏览器报错。 解决方案： 我这边是在项目中
报错：Unable to preventDefault inside passive event listener invocation
最新发布
bingmoujs的博客
04-12 771
"Unable to preventDefault inside passive event listener invocation"是浏览器开发中的一个警告信息。这个警告通常出现在使用passive事件监听器时，当在事件处理函数中调用preventDefault()方法时会引发该警告，不会实际影响使用，就是控制台一直报红贼难看。1.新建公用文件：browserPatch.js（可以是在common目录或者untils目录，根据自己的项目定）ts转行书写格式同理。
解决Unable to preventDefault inside passive event listener invocation.报错
qq_39877681的博客
11-29 929
解决Unable to preventDefault inside passive event listener invocation.报错
react-dom.development.js:6202 Unable to preventDefault inside passive event listener invocation 错误
goodfornothi的博客
09-10 922
出现这种错误可能是浏览器默认事件与rereact-dom.development.js中的默认事件产生冲突，在浏览器中找到act-dom.development.js文件的地址，打开将你添加组件的默认事件的代码注销即可。
vue使用高德地图报错Unable to preventDefault inside passive event listener invocation.
weixin_45799605的博客
09-15 2439
之前项目使用高德地图 一直都没问题 不知道怎么会遇到这种问题 鼠标在地图上移动就会报错 搞了好久 禁止使用 default-passive-events 如果发现删除就不会报错了 怕pagejson文件删除 重新下载依赖
antd vue中点击 select 下拉框时， 报错Unable to preventDefault inside passive event listener invocation.
pan2259363027的博客
08-25 474
antd vue中点击 select 下拉框时， 报错Unable to preventDefault inside passive event listener invocation.
谷歌浏览器事件坑：Unable to preventDefault inside passive event listener invocation.
古月水告的博客
03-24 723
从 chrome56 开始，在 window、document 和 body 上注册的 touchstart 和 touchmove 事件处理函数，会默认为是 passive: true。插件是解决浏览器告警的，我不想浏览器有告警信息，但加上又使浏览器报错，怎么处呢？，它默认情况下启用某些事件的被动事件侦听器，基本上每次声明新的事件监听器时，都会自动设置。插件导致的，注释了在main.js引入的就没有报错了。1、注册处理函数时，用如下方式，明确声明为不是被动的。，图一时畅快，现在出现问题了。
“填坑”之解决Unable to preventDefault inside passive event listener invocation.
m0_46074266的博客
02-06 8950
Unable to preventDefault inside passive event listener invocation.
element-ui.common.js:13762 Unable to preventDefault inside passive event listener invocation
12-08
这个警告通常是由于在被动事件监听器中调用了preventDefault()方法而引起的。这是因为在被动事件监听器中，preventDefault()方法被视为无效，因此会引发警告。要解决这个问题，可以采取以下方法： 1.在添加事件监听器时，将{ passive: false }选项添加到选项对象中，以明确指定事件监听器是主动的，而不是被动的。例如： ```javascript element.addEventListener('touchstart', onTouchStart, { passive: false }); ``` 2.如果您使用的是Vue.js框架，则可以在组件的mounted()钩子函数中添加以下代码： ```javascript mounted() { this.$nextTick(() => { const el = this.$el.querySelector('.your-element-class'); el.addEventListener('touchstart', this.onTouchStart, { passive: false }); }); }, ``` 这将确保在组件挂载后添加事件监听器，并将选项设置为{ passive: false }。 3.如果您使用的是element-ui库，则可能需要更新库的版本，以便解决这个问题。您可以尝试升级到最新版本，或者查看库的文档以获取更多信息。
评论 19
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

小龍

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值