fastclick作用
用于消除物理敲击与click移动浏览器上的事件触发之间的300ms延迟。(https://www.npmjs.com/package/fastclick)
问题:
在移动端,用了antd mobile的输入框组件,但是ios用户都反馈输入框点击不灵敏,有时候要点好几下才能点中输入框。
原因:
1.可能是样式上输入框被遮住了。
2.设备点击问题
尝试:
1.针对第一种可能,我在样式上给输入框加了z-index,还有宽高,但是问题还是有,所以排除第一种可能。
2.第二种可能是基于我用了fastclick解决点击问题。
解决方法
·1:在fastclick的源码中增加。若你npm下载了fastclick,那就去node_modules中的fastclick包中找到FastClick.prototype.focus。
FastClick.prototype.focus = function(targetElement) {
var length;
if (deviceIsIOS && targetElement.setSelectionRange && targetElement.type.indexOf('date') !== 0 && targetElement.type !== 'time' && targetElement.type !== 'month' && targetElement.type !== 'email') {
length = targetElement.value.length;
targetElement.focus();//加入这一句话就OK了
targetElement.setSelectionRange(length, length);
} else {
targetElement.focus();
}
};
然后每次打包的时候注意一下这个包有没有这一句。(因为我没试过这种,试过效果的朋友跟我说一下哈)
·2:不是通过npm包管理工具下载的,而是页面引入的,那就需要下载fastclick的包,然后在包里面像上一种方式一样增加一句代码(targetElement.focus())。如果项目里面有处理文件路径的那随便放fastclick包,然后改一下public/index.html的引入;如果没有文件路径处理,那fastclick在public/index.html的引入,就可能引起打包时的路径查找问题,所以我直接把fastclick的包放在public下,这样dist里面也会新增一个fastclick.