對vux點擊事件的優(yōu)化詳解
更新時間：2018年08月28日 09:22:02 作者：草木黃塵
今天小編就為大家分享一篇對vux點擊事件的優(yōu)化詳解，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
Vux是基于Vue和WeUI的組件庫。對于應(yīng)用vux的項目因為點擊綁定的是click事件，自然也存在移動端300ms延遲現(xiàn)象。我們可以用fastclick庫來解決這個問題，具體步驟如下：
這里以vue+webpack項目目錄為例：
1、打開node控制臺，切換到自己的項目目錄
2、npm安裝fastclick，并將版本信息寫入本地packpage.json文件
3、下載成功后，在node_modules目錄下可以看見fastclick庫文件夾，且在packpage.json文件里可以看見：
4、在src目錄下的main.js文件加上語句即可解決延遲問題：
const FastClick = require('fastclick');
FastClick.attach(document.body);
引用fastclick的場景不一定是在vue+webpack項目結(jié)構(gòu)下,還有其他的引入場景：
直接script引入fastclick.js文件并調(diào)用內(nèi)置方法
<script type='application/javascript' src='./src/fastclick.js'></script>
<script>
if ('addEventListener' in document) {
document.addEventListener('DOMContentLoaded', function() {
FastClick.attach(document.body);
}, false);
}
// 如果有引入jquery庫，還可以這樣：
$(function() {
FastClick.attach(document.body);
});
</script>
更多的引入場景及具體引入方法請參見fastclick。
以上這篇對vux點擊事件的優(yōu)化詳解就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了vue之keepAlive使用案例詳解,本篇文章通過簡要的案例,講解了該項技術(shù)的了解與使用,以下就是詳細(xì)內(nèi)容,需要的朋友可以參考下2021-09-09
這篇文章主要介紹了Vue?keep-alive的實現(xiàn)原理分析，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-04-04
在Vue3中使用vue3-print-nb實現(xiàn)前端打印功能
在前端開發(fā)中,經(jīng)常需要打印頁面的特定部分,比如客戶列表或商品詳情頁,要快速實現(xiàn)這些功能,可以使用 vue3-print-nb 插件,本文就給大家介紹了如何在 Vue 3 中使用 vue3-print-nb 實現(xiàn)靈活的前端打印,需要的朋友可以參考下2024-06-06
vue指令只能輸入正數(shù)并且只能輸入一個小數(shù)點的方法
這篇文章主要介紹了vue指令只能輸入正數(shù)并且只能輸入一個小數(shù)點的方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-06-06
這篇文章主要介紹了Vue混入使用和選項合并，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2021-10-10
這篇文章主要介紹了vue數(shù)據(jù)對象length屬性未定義問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-06-06
electron踩坑之remote of undefined的解決
這篇文章主要介紹了electron踩坑之remote of undefined的解決，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-10-10
Element-ui的table中使用fixed后出現(xiàn)行混亂情況的解決
這篇文章主要介紹了Element-ui的table中使用fixed后出現(xiàn)行混亂情況的解決方案,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2023-10-10
這篇文章主要為大家詳細(xì)介紹了Vue實現(xiàn)拖拽改變列表順序的相關(guān)知識,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2024-04-04
Vue2為何能通過this訪問到data與methods的屬性
這篇文章主要介紹了Vue2為何能通過this訪問到data與methods的屬性，文章圍繞主題展開詳細(xì)的內(nèi)容戒殺，具有一定的參考價值，需要的小伙伴可以參考一下2022-09-09