Vue.js作為一款前端框架,越來越受到開發者的歡迎,但是隨著項目的復雜度增加,一些潛在的問題也逐漸暴露了出來。其中之一就是vue-fastclick插件的bug。
vue-fastclick是一個優化移動端點觸事件的插件,通過解決click事件在移動端300ms延遲的問題,提升用戶體驗。然而,在使用vue-fastclick時,有時點擊按鈕或鏈接會返回上一頁、或無法鏈接跳轉,這個問題就被稱為“fastclick bug”。
import FastClick from 'fastclick'; FastClick.attach(document.body);
解決fastclick bug的方法較為簡單,只需在使用vue-fastclick時,在路由切換時手動清除事件綁定即可:
import router from './router'; import FastClick from 'fastclick'; FastClick.attach(document.body); router.beforeEach((to, from, next) =>{ FastClick.destroy(); next(); });
使用此方法后,fastclick bug不會再出現。但是需要注意的是,當從非fastclick頁面進入fastclick頁面時,事件綁定并不會被清除,為了避免這種情況,最好將FastClick.attach()方法放置在路由根文件中。