因touch-action: none;得mescroll

湖工電氣發表於2018-03-01

最近在幫一個朋友做一個貸款類的H5應用,有頁面需要上下拉重新整理,每個item點選還可以進入詳情。由於使用的是SUI Mobile 框架,導致a標籤跳轉不成功,且谷歌瀏覽器除錯列印如下警告提示:Unable to preventDefault inside passive event listener due to target being treated as passive?。網上給的答案是加上* { touch-action: none; } 。這樣做確實可以去掉上面的警告且點選也可以跳轉,似乎一切OK。
下班回家後,躺在床上沒事,就用手機開啟看看,結果發現頁面不能滑動了。安卓手機不能滑動,蘋果手機沒問題,瀏覽器沒問題。
第二天是禮拜,一天沒弄,第三天上班了,又看SUI的文件,又百度,又各種嘗試,最後到了晚上7點多才找到了問題所在。
之前以為是SUI的上下拉外掛的問題和SUI滑動條的問題,後來換了上下拉的外掛為MUImescroll(mescroll是目前我發現手機端最好的一個上下拉外掛);問題都不見解決。最後想想我那天最後加的那個css屬性* { touch-action: none; }。我是全域性加的,但是那天只是一個頁面有問題,加了之後那個頁面點選沒問題了,但是全部頁面安卓機都不能滑動了。後來去掉了這個css屬性之後,一切OK了,而且還知道了一個很不多的上下拉外掛mescrollMUI 這個我不想多說什麼, 兩年前就用這個做過幾個app,也一直在關注這個框架,依然是問題一堆,做些小應用還是OK的,大應用或者涉及到硬體方面的,還是不建議使用這個。
因為一個* { touch-action: none; },鬱悶一天,那天下午上班期間跑去樓下看了《紅海行動》,嘿嘿,不要告訴我老闆。
2月份,一整個月沒寫一篇部落格。公司雜七雜八的事情,個人的事情,過年……
昨天公司走了幾個同事,老闆要把人員縮減到10個人,其他人基本都要走了,我是沒打算走。
出來工作幾年了,覺得平臺確實很重要(我目前在一個小公司),但是個人的學習更加重要。
每天學一點,生活更美好。

相關文章