Vintage模板前臺頁面需要實(shí)現(xiàn)的功能很多，其中有一個(gè)就是防止用戶重復(fù)點(diǎn)擊按鈕，引入了Vue的FastClick.js插件。

什么是FastClick.js？它是一個(gè)解決瀏覽器300ms點(diǎn)擊延遲的插件。在移動(dòng)端上，瀏覽器520ms后才觸發(fā)click事件，原因是瀏覽器等待知道用戶是否正在進(jìn)行雙擊操作，因此FastClick.js在觸摸結(jié)束后立即檢查觸摸時(shí)間，如果時(shí)間小于200ms，則FastClick.js會(huì)拋出自定義click事件，避免了等待300ms的延遲。

FastClick.js的優(yōu)勢是非常明顯的，首先可以提高用戶使用體驗(yàn)。200ms的等待時(shí)間對于用戶來說是很明顯的， 當(dāng)用戶點(diǎn)擊一個(gè)按鈕時(shí)，沒有立即反饋給用戶，用戶就會(huì)認(rèn)為這個(gè)按鈕是壞的、系統(tǒng)出現(xiàn)問題等，這無疑會(huì)降低用戶的使用體驗(yàn)。因此，使用FastClick.js，用戶的點(diǎn)擊會(huì)立即觸發(fā)響應(yīng)，提高了用戶使用體驗(yàn)。

## 引入FastClick.js插件
在Vintage模板中，你可以將FastClick.js插件vue-fastclick引入到你的Vue項(xiàng)目中。下面是它的安裝方式：
1. 在命令行終端進(jìn)入項(xiàng)目根目錄
2. 執(zhí)行 npm install vue-fastclick –save 命令

引入FastClick.js插件安裝成功后我們來看如何在Vue項(xiàng)目中使用它。 1. 在app.vue中引入fastclick

// app.vue
import FastClick from 'fastclick'
FastClick.attach(document.body)

在app.vue引入FastClick.js, 并調(diào)用一個(gè)方法將其attach到組件中。

// 終端執(zhí)行命令，重新編譯項(xiàng)目
npm run build

重新編譯項(xiàng)目后，在瀏覽器中運(yùn)行Vue項(xiàng)目，此時(shí)你的Vintage模板環(huán)境就已經(jīng)支持FastClick.js了。

FastClick.js的使用引入了Vue項(xiàng)目環(huán)境緩解了頁面點(diǎn)擊延遲的問題，提高了用戶的使用體驗(yàn)，同時(shí)在主流手機(jī)瀏覽器上，F(xiàn)astClick.js也是性能和用戶體驗(yàn)最優(yōu)秀的解決方案之一。

如果你的Vue項(xiàng)目需求中頻繁使用到點(diǎn)擊事件，那么請不要猶豫，加入FastClick.js插件文件吧。