Vue项目引用fastclick
作者:
秒速五厘米
一、npm指令
npm install fastclick -S 或者 cnpm install fastclick -S
二、然后在main.js写上
// 引入
import FastClick from 'fastclick'
// 使用
FastClick.attach(document.body);
package.json 安装之后会有
"Dependencies": {
"fastclick": "^1.0.6",
}三.使用过程中存在的bug:
当使用FastClick 时,input框在ios上点击输入调取手机自带输入键盘不灵敏,有时候甚至点不出来。
而安卓上完全没问题。这个原因是因为FastClick的点击穿透。解决方法:
FastClick.prototype.onTouchEnd = function(event) {
if(event.target.hasAttribute("type") && event.target.getAttribute("type") == "text") {
event.preventDefault();
return false;
}
}why use 'fastclick'?
在移动端H5开发过程中,关于点触可能会遇到如下两个问题:
1、手动点击与真正触发click事件会存在300ms的延迟(ios上面最明显)
2、点击穿透问题(点击行为会穿透元素触发非父子关系元素的事件)