不论是H5开发还是微信小程序，手机端点击都会有300ms的延迟，在实际项目中，会到此频繁触发，如有接口会频繁的请求接口，除了会引起不必要的多次请求还会导致数据有问题。下面有二种方式来处理这个问题：
1、节流
节流的目的是防止过多频繁的请求。导致资源的浪费，影响性能。
function throttle(fn, gapTime) {
if (gapTime == null || gapTime == undefined) gapTime = 1500
let _lastTime = null
return function () { // 返回新的函数
let _nowTime = + new Date()
if (_nowTime - _lastTime > gapTime || !_lastTime) {
fn.apply(this, arguments) //将this和参数传给原函数
_lastTime = _nowTime
}
}
}
使用方法：
tap: util.throttle(function (e) {
console.log(this)
console.log(e)
console.log((new Date()).getSeconds())
}, 1000)
2、消除手机移动端的点击延迟。
通常移动端点击延迟有许多中方式，这里会介绍一二种方式，fastclick 是一个很好用的方法。引入fastclick。
纯Javascript版：
if ( 'addEventListener' in document ) {
document.addEventListener( 'DOMContentLoaded',function(){
FastClick.attach( document.body)
} )
}
jqery版：
$(function(){
FastClick.attach($('body'))
})
但是在使用中需要过滤掉许多不适用这个方式的元素，如a标签 这时在标签上添加 class needsclick
下面是fastclick的详细用法
<script src="https://as.alipayobjects.com/g/component/fastclick/1.0.6/fastclick.js"></script>
<script>
if ('addEventListener' in document) {
document.addEventListener('DOMContentLoaded', function() {
FastClick.attach(document.body);
}, false);
}
if(!window.Promise) {
document.writeln('<script src="https://as.alipayobjects.com/g/component/es6-promise/3.2.2/es6-promise.min.js" '+'>'+'<'+'/'+'script>');
}
</script>