1. ホーム
  2. vue

vueの開発です。[違反】スクロールブロックの<some>イベントに非パッシブなイベントリスナーを追加しました。このような場合、Consider ma...

2022-02-16 11:34:24

Element-uiをベースにしたプロジェクトを書くと、Chromeのアラートが出る。
[違反】スクロールブロックの「mousewheel」イベントに非パッシブなイベントリスナーを追加した。

以下のように訳されています。
違反です。touchstart' イベントをブロックするパッシブイベントリスナーが追加されていません。ページをスムーズに表示するために、イベントマネージャー 'passive' の追加を検討してください。
これは、Chromeのバージョン51以降、Chromeに新しいイベントキャッチの仕組みである「パッシブイベントリスナー」が追加されたからです。

パッシブ・イベント・リスナー これは、ページ内の旧イベントリスナーがイベントのデフォルト動作をブロックするために preventDefault 関数を呼び出すかどうかを伝え、ブラウザがこの情報に基づいてページのパフォーマンスを最適化するためにより良い判断を下せるようにするものです。passiveプロパティの値がtrueの場合、リスナーが内部でpreventDefault関数を呼び出してデフォルトのスワイプ動作を阻止しないことを意味し、Chromeはこれをパッシブリスナーと呼びます。Chromeは現在、スワイプのパフォーマンスを最適化するためにこの機能を使用しているため、パッシブイベントリスナー機能は現在、マウスホイール/タッチ関連のイベントのみをサポートしています。

解決策

1. npm i default-passive-events -S

2. main.js add: import 'default-passive-events'.

参照先 https://blog.csdn.net/dj0379/article/details/52883315