今天在編寫移動端app的時候，一個報錯引起了我的注意，報錯如下：
Unable to preventDefault inside passive event listener
due to target being treated as passive.
因爲自己以前也沒有見過這個錯誤，所以百度了下，這個特性是從Chrome 51 開始的，旨在提升頁面的流暢度，具體的解釋如下（摘自SegmentFault）:
當你觸摸滑動頁面時，頁面應該跟隨手指一起滾動。如果你綁定了一個觸摸事件（大概執行 200 毫秒），瀏覽器就犯迷糊了：如果你在事件綁定函數中調用了 preventDefault，那麼頁面就不應該滾動；但是瀏覽器一開始不知道你有沒有調用，只能先執行你的函數，等 200 毫秒後，瀏覽器才知道，“哦，原來你沒有阻止默認行爲，好的我馬上滾”。此時，頁面開始滾。
經統計，80% 左右的觸摸事件都沒有被 preventDefault 阻止，這些等待的時間都被浪費掉了。使用 Passive Event Listeners，開發者能夠提前告訴瀏覽器：“我不調用 preventDefault 函數來阻止事件默認行爲”，那麼瀏覽器就無需等待事件執行完成，而是直接執行默認行爲（滾動）。
在這裏我們就有必要來了解一下addEventListener方法，該方法接收三個參數，window.addEventListener(type, fn, { passive: false })，type表示監聽事件類型的字符串，fn作爲事件調用的函數，第三個參數默認爲false，表示瀏覽器檢測使用的preventDefault。
從passive event listener 被引進Chrome開始，我們就可以通過給addEventListener 設置第三個參數{passive：true}來避免瀏覽器對prevent Default 的檢測，從而使滑動顯得比較流暢，當我們給addEventListener 設置了{passive: true}時，這個監聽器也就被稱爲passive event listener。
解決方案：
理解了出現這個問題的原理，我們就來說說解決問題的方案：
1、設置全局css樣式
*{
//當觸控事件發生在元素上時，不進行任何操作
touch-action: none;
}
2、使用JS的時間監聽方法來解決
window.addEventListener('type',fn,{passive: true});
總結：
其實這個問題不會造成頁面的崩潰，但是它的的確確的影響了性能的優化，所以來記錄下自己的解決方法。