1. 程式人生 > 程式設計 >解決Vue 移動端點擊出現300毫秒延遲的問題

解決Vue 移動端點擊出現300毫秒延遲的問題

1. 安裝模組

cnpm install fastclick -S

2. 在main.js中引入,並繫結到body

import FastClick from 'fastclick'

FastClick.attach(document.body);

當better-scroll和 fastclick衝突的不能點選的時候:

<slider>
  <div v-for="item in recommends">
  <a :href="item.linkUrl" rel="external nofollow" >
   <!-- 當better-scroll和 fastclick衝突的不能點選的時候,只需要加上class="needsclick",圖片就可以被點選了,解決衝突的問題 -->
   <img class="needsclick" @load="loadImage" :src="item.picUrl">
  </a>
  </div>
</slider>

補充知識:@types/fastclick在vue+ts中的使用

1、在使用了ts的vue專案中,以往直接安裝fastclick不能正常使用,根據提示執行下面命令就好了

cnpm i @types/fastclick

2、找到node-modules下面的@types/fastclick/index.d.ts檔案,然後開啟修改裡面內容即可

在這裡插入程式碼片declare module "fastclick" {
 // function fastclick(layer: any,options?: FastClickOptions): FastClickObject;
 // namespace fastclick {
 // var FastClick: FastClickStatic;
 // }這裡註釋的程式碼刪掉
 var FastClick: FastClickStatic;//改成這行程式碼
 export = FastClick;
}

main.ts裡面按照以往的配置就好了

import FastClick from 'fastclick';

FastClick.attach(document.body);

以上這篇解決Vue 移動端點擊出現300毫秒延遲的問題就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支援我們。