[Violation] Added non-passive event listener to a scroll-blocking <some> event.


[Violation] Added non-passive event listener to a scroll-blocking <some> event.

Passive Event Listeners——讓頁面滑動更加流暢的新特性

Passive Event Listeners - 被動事件監聽器,在寫H5頁面的時候,Chrome 提醒。

報錯信息:

Vue控制台警告 :[Violation] Added non-passive event listener to a scroll-blocking event.

Consider marking event handler as ‘passive’ to make the page more responsive.

翻譯如下:

違反:沒有添加被動事件監聽器來阻止’touchstart’事件,請考慮添加事件管理者’passive’,以使頁面更加流暢。

這個是 Chrome51 版本以后,Chrome 增加了新的事件捕獲機制-Passive Event Listeners;

Passive Event Listeners:就是告訴前頁面內的事件監聽器內部是否會調用preventDefault函數來阻止事件的默認行為,

以便瀏覽器根據這個信息更好地做出決策來優化頁面性能。當屬性passive的值為true的時候,

代表該監聽器內部不會調用preventDefault函數來阻止默認滑動行為,

Chrome瀏覽器稱這類型的監聽器為被動(passive)監聽器。

目前Chrome主要利用該特性來優化頁面的滑動性能,

所以Passive Event Listeners特性當前僅支持mousewheel/touch相關事件。

解決辦法

npm i default-passive-events -S

main.js中加入:import ‘default-passive-events’

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM