今天在寫vue項目的時候碰到一個
Unable to preventDefault inside passive event listener due to target being treated as passive. See <URL>
這樣的bug 然后找了一通發(fā)現(xiàn)可以用 *{touch-action：none}這個方法
用法是禁用元素（及其不可滾動的后代）上的所有手勢开财，以使用自己提供的拖放和縮放行為（如地圖或游戲表面）缘厢。
由此找了其他的屬性值 發(fā)現(xiàn)還挺強大的
touch-action: auto;
touch-action: none;
touch-action: pan-x;
touch-action: pan-left;
touch-action: pan-right;
touch-action: pan-y;
touch-action: pan-up;
touch-action: pan-down;
touch-action: pinch-zoom;
touch-action: manipulation;
/* Global values */
touch-action: inherit;
touch-action: initial;
touch-action: unset;
默認情況下普泡，平移（滾動）和縮放手勢由瀏覽器專門處理熊楼。 使用
Pointer_events的應用程序?qū)⒃跒g覽器開始處理觸摸手勢時收到一個 pointercancel 事件。 通過明確指定瀏覽器應該處理哪些手勢悠轩，應用程序可以在 pointermove 和 pointerup 監(jiān)聽器中為其余的手勢提供自己的行為乍赫。 使用Touch_events的應用程序通過調(diào)用preventDefault()禁用瀏覽器處理手勢，但也應使用觸摸操作確保瀏覽器在調(diào)用任何事件偵聽器之前棕叫，了解應用程序的意圖。
當手勢開始時奕删，瀏覽器與觸摸的元素及其所有祖先的觸摸動作值相交直到一個實現(xiàn)手勢（換句話說俺泣，第一個包含滾動元素）的觸摸動作值。 這意味著在實踐中完残，觸摸動作通常僅適用于具有某些自定義行為的單個元素伏钠，而無需在該元素的任何后代上明確指定觸摸動作。 手勢開始之后谨设，觸摸動作值的更改將不會對當前手勢的行為產(chǎn)生任何影響熟掂。
值
auto
當觸控事件發(fā)生在元素上時，不進行任何操作扎拣。
none
當觸控事件發(fā)生在元素上時赴肚，不進行任何操作
pan-x
啟用單指水平平移手勢《叮可以與 pan-y 誉券、pan-up、pan-down 和／或 pinch-zoom 組合使用
pan-y
啟用單指垂直平移手勢刊愚∮桓可以與 pan-x 、pan-left 鸥诽、pan-right 和／或 pinch-zoom 組合使用商玫。
manipulation
瀏覽器只允許進行滾動和持續(xù)縮放操作。任何其它被auto值支持的行為不被支持牡借。啟用平移和縮小縮放手勢拳昌，但禁用其他非標準手勢，例如雙擊以進行縮放钠龙。 禁用雙擊可縮放功能可減少瀏覽器在用戶點擊屏幕時延遲生成點擊事件的需要地回。 這是“pan-x pan-y pinch-zoom”（為了兼容性本身仍然有效）的別名。
pan-left, pan-right,pan-up,pan-down
啟用以指定方向滾動開始的單指手勢俊鱼。 一旦滾動開始刻像，方向可能仍然相反。 請注意并闲，滾動“向上”（pan-up）意味著用戶正在將其手指向下拖動到屏幕表面上细睡，同樣 pan-left 表示用戶將其手指向右拖動。 多個方向可以組合帝火，除非有更簡單的表示（例如溜徙，“pan-left pan-right”無效湃缎，因為“pan-x”更簡單，而“pan-left pan-down”有效）蠢壹。
pinch-zoom
啟用多手指平移和縮放頁面嗓违。 這可以與任何平移值組合。
示例
最常見的用法是禁用元素（及其不可滾動的后代）上的所有手勢图贸，以使用自己提供的拖放和縮放行為（如地圖或游戲表面）
#map {
touch-action: none;
}
另一種常見的模式是使用指針事件處理水平平移的圖像輪播蹂季，但不想干擾網(wǎng)頁的垂直滾動或縮放。
.image-carousel {
width: 100%;
height: 150px;
touch-action: pan-y pinch-zoom;
}
觸摸動作也經(jīng)常用于完全解決由支持雙擊縮放手勢引起的點擊事件的延遲疏日。
html {
touch-action: manipulation;
}
