Vue3.x 控制台警告 [Violation] Added non-passive event listener to a scroll-blocking 'touchmove' event. Consider marking event handler as 'passive' to make the page more responsive.

4,948次阅读
没有评论

共计 1168 个字符,预计需要花费 3 分钟才能阅读完成。

控制台警告信息

[admonition]

[Violation] Added non-passive event listener to a scroll-blocking ‘touchmove’ event. Consider marking event handler as ‘passive’ to make the page more responsive.

[/admonition]

情况说明

以下说明引用至https://stackoverflow.com/questions/39152877/consider-marking-event-handler-as-passive-to-make-the-page-more-responsive/62639220

想了解更多关于这个的问题可以点上面链接进去看原文

For those receiving this warning for the first time, it is due to a bleeding edge feature called Passive Event Listeners that has been implemented in browsers fairly recently (summer 2016). From https://github.com/WICG/EventListenerOptions/blob/gh-pages/explainer.md:

Passive event listeners are a new feature in the DOM spec that enable developers to opt-in to better scroll performance by eliminating the need for scrolling to block on touch and wheel event listeners. Developers can annotate touch and wheel listeners with {passive: true} to indicate that they will never invoke preventDefault. This feature shipped in Chrome 51, Firefox 49 and landed in WebKit. For full official explanation read more here.

其实说白了就是个新特性,似乎是用来提高移动端页面滚动效率的?

我也整不太明白,这也不是个错误,只是个警告。

解决方法非常简单,看下面

解决方法

有两种方法,我倾向于第二种

1、在鼠标滚动方法上加上passive,如下所示

@mouseleave.passive="leave"

2、安装扩展,一劳永逸

npm i default-passive-events -S

安装后,在main.js里引入即可

import 'default-passive-events'

 

正文完
 5
zjh4473
版权声明:本站原创文章,由 zjh4473 于2022-04-05发表,共计1168字。
转载说明:除特殊说明外本站文章皆由CC-4.0协议发布,转载请注明出处。
评论(没有评论)