vue.js 添加 fastclick的支持方法

更新時(shí)間：2018年08月28日 09:05:44 作者：非凡主力

今天小編就為大家分享一篇vue.js 添加 fastclick的支持方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧

fastclick：處理移動(dòng)端click事件300毫秒延遲

1、兼容性

iOS 3及更高版本的移動(dòng)Safari

iOS 5及更高版本的Chrome

Android上的Chrome（ICS）

Opera Mobile 11.5及以上版本

Android 2以來(lái)的Android瀏覽器

PlayBook OS 1及以上版本

2、不應(yīng)用FastClick的場(chǎng)景

桌面瀏覽器;

如果視口元標(biāo)簽中設(shè)置了width=device-width，Android上的Chrome 32+會(huì)禁用300ms延時(shí);

<meta name="viewport" content="width=device-width, initial-scale=1">

視頻元標(biāo)簽如果設(shè)置了user-scalable=no，Android上的Chrome（所有版本）都會(huì)禁用300ms延遲。

IE10中，可以使用css屬性-ms-touch-action: none禁止元素雙擊縮放（參考文章）。

3、安裝：

先執(zhí)行安裝fastclick的命令。

npm install fastclick -S

之后，在main.js中引入，并綁定到body

import FastClick from 'fastclick'

FastClick.attach(document.body);

以上這篇vue.js 添加 fastclick的支持方法就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

通過(guò)圖帶你深入了解vue的響應(yīng)式原理
這篇文章主要介紹了通過(guò)圖帶你深入了解vue的響應(yīng)式原理，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，
2019-06-06
vue父列表數(shù)據(jù)獲取子列表數(shù)據(jù)的實(shí)現(xiàn)步驟
本文檔將介紹如何通過(guò)點(diǎn)擊父列表（表格）中的數(shù)據(jù)行來(lái)獲取到子列表（表格）的數(shù)據(jù),代碼示例是基于Vue框架實(shí)現(xiàn)的一個(gè)組件,包含了父列表和子列表,通過(guò)點(diǎn)擊父列表的數(shù)據(jù)行來(lái)動(dòng)態(tài)獲取子列表的數(shù)據(jù),感興趣的朋友跟隨小編一起看看吧
2024-06-06
Vue 兄弟組件通信的方法（不使用Vuex）
本篇文章主要介紹了Vue 兄弟組件通信的方法（不使用Vuex），小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2017-10-10
Vue $nextTick 為什么能獲取到最新Dom源碼解析
這篇文章主要為大家介紹了Vue $nextTick 為什么能獲取到最新Dom源碼解析，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
2022-10-10
element-ui中select組件綁定值改變,觸發(fā)change事件方法
今天小編就為大家分享一篇element-ui中select組件綁定值改變,觸發(fā)change事件方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
2018-08-08
實(shí)例詳解vue.js淺度監(jiān)聽(tīng)和深度監(jiān)聽(tīng)及watch用法
這篇文章主要介紹了vue.js淺度監(jiān)聽(tīng)和深度監(jiān)聽(tīng)及watch用法，本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值，需要的朋友參考下吧
2018-08-08
詳解vue中v-model的實(shí)現(xiàn)原理
v-model可以實(shí)現(xiàn)數(shù)據(jù)的雙向綁定,也是vue的最突出的優(yōu)勢(shì),其實(shí) v-model 實(shí)際上是一個(gè)語(yǔ)法糖,本文將給大家介紹一下vue中v-model的實(shí)現(xiàn)原理,文中有相關(guān)的代碼供大家參考,具有一定的參考價(jià)值,需要的朋友可以參考下
2023-12-12
vue把頁(yè)面轉(zhuǎn)換成圖片導(dǎo)出方式(html2canvas導(dǎo)出不全問(wèn)題)
這篇文章主要介紹了vue把頁(yè)面轉(zhuǎn)換成圖片導(dǎo)出方式(html2canvas導(dǎo)出不全問(wèn)題),具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
2023-10-10
Vue router安裝及使用方法解析
這篇文章主要介紹了Vue router安裝及使用方法解析,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下
2020-12-12
vue 下列表側(cè)滑操作實(shí)例代碼詳解
本文通過(guò)實(shí)例代碼給大家介紹了vue 下列表側(cè)滑操作,非常不錯(cuò)，具有一定的參考借鑒價(jià)值，需要的朋友可以參考下
2018-07-07