fastclick插件的作用以及使用方法

FastClick是专门未解决移动端浏览器300ms点击延迟和点击穿透问题所开发的一个轻量级的库。FastClick实现原理是在检测到touchend事件的时候，会通过DOM自定义事件立即发出模拟一个click事件，并把浏览器在300ms之后的click事件阻止掉。

点击穿透问题

说完移动端点击300ms延迟的问题，还不得不提一下移动端点击穿透的问题。可能有人会想，既然click点击有300ms的延迟，那对于触摸屏，我们直接监听touchstart事件不就好了吗？ 使用touchstart去代替click事件有两个不好的地方。 第一：touchstart是手指触摸屏幕就触发，有时候用户只是想滑动屏幕，却触发了touchstart事件，这不是我们想要的结果； 第二：使用touchstart事件在某些场景下可能会出现点击穿透的现象。

什么是点击穿透？ 假如页面上有两个元素A和B。B元素在A元素之上。我们在B元素的touchstart事件上注册了一个回调函数，该回调函数的作用是隐藏B元素。我们发现，当我们点击B元素，B元素被隐藏了，随后，A元素触发了click事件。

这是因为在移动端浏览器，事件执行的顺序是touchstart > touchend > click。而click事件有300ms的延迟，当touchstart事件把B元素隐藏之后，隔了300ms，浏览器触发了click事件，但是此时B元素不见了，所以该事件被派发到了A元素身上。如果A元素是一个链接，那此时页面就会意外地跳转。

使用

vu移动端项目中安转并且引用

import FastClick from 'fastclick'
FastClick.attach(document.body)