對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)文章
這篇文章主要為大家詳細(xì)介紹了vue實現(xiàn)樓層跳轉(zhuǎn)效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-03-03
這篇文章主要給大家介紹了關(guān)于如何快速將Vue項目升級到webpack3的方法步驟文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧。2017-09-09
vue router總結(jié) $router和$route及router與 router與route區(qū)別
這篇文章主要介紹了vue router總結(jié) $router和$route及router與 router與route區(qū)別，本文給大家介紹的非常詳細(xì)，具有一定的參考借鑒價值 ,需要的朋友可以參考下2019-07-07
vue-router是vue.js官方給出的路由解決方案，能夠輕松的管理SPA項目中組件的切換，這篇文章主要介紹了Vue3?中路由Vue?Router?的使用,需要的朋友可以參考下2023-02-02
今天小編就為大家分享一篇vue動態(tài)禁用控件綁定disable的例子，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-10-10
這篇文章主要介紹了Element PageHeader頁頭的使用方法，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-07-07
vue微信分享的實現(xiàn)(在當(dāng)前頁面分享其他頁面)
這篇文章主要介紹了vue微信分享，在當(dāng)前頁面分享其他頁面，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2019-04-04
這篇文章主要為大家詳細(xì)介紹了Vue3導(dǎo)航欄組件封裝的實現(xiàn)方法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-09-09
這篇文章主要給大家介紹了關(guān)于在Vue中使用Echarts可視化庫的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-11-11
Vue3的確可以直接使用tsx開發(fā),唯一需要處理的就是children,而且處理起來還是比較不爽的,下面這篇文章主要給大家介紹了關(guān)于TSX常見簡單入門用法之Vue3+Vite的相關(guān)資料,需要的朋友可以參考下2022-08-08