关于Added non-passive event listener to a scroll-blocking ‘wheel‘ event. Consider marking event handle

关于Added non-passive event listener to a scroll-blocking 'wheel' event. Consider marking event handler as 'passive' to make the page more responsive.的新解决方案

一般出现这个问题,肯定大部分人都是使用default-passive-events插件。

但是随着项目的扩大,default-passive-events难免会和其他插件产生冲突,比如canvas库konvajs。

在使用konvajs和default-passive-events后,肯定会报:

拖拽时

Unable to preventDefault inside passive event listener invocation.

没办法,我们只能禁用default-passive-events插件

我们新建一个polyfill.js文件


//去除谷歌的touch事件警告
(function () {
  if (typeof EventTarget !== "undefined") {
    let func = EventTarget.prototype.addEventListener;
    EventTarget.prototype.addEventListener = function (type, fn, capture) {
      this.func = func;
      if (typeof capture !== "boolean") {
        capture = capture || {};
        capture.passive = false;
      }
      this.func(type, fn, capture);
    };
  };
}());

然后再main.js文件中引入,一定要在vue初始化之前,最好这个放最开头

main.js

require(“@/utils/polyfill”); // 去除touch事件谷歌提示

然后即可搞定。

  • 5
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值