今天做react优化的时候,想到了click的延迟事件;
引入了react-fastclick模块;
想要探究一下fastclick插件背后原理,由于react-fastclick中的事件都是合成事件,可能会稍微复杂一些,所以在网上找了一个原生js可用的的fastclick.js模块。
插件的注释写得真的太友好了,几乎可以无障碍阅读,比jquery简单。
大概思路就是,先判断它是不是一个滑动(如果是一个滑动,就好比你滑动页面,不小心经过了该div,是不会触发的。)以及点击从开始到结束时间间隔是否>100ms,(这个应该是一个约定俗成的东西),判断结束之后就dispatch一个事件
接着,取消实际绑定的click事件,(我觉得是这个插件里面我觉得最精妙的部分)
```
// Prevent any user-added listeners declared on FastClick element from being fired.
if (event.stopImmediatePropagation) {
event.stopImmediatePropagation();
} else {
// Part of the hack for browsers that don't support Event#stopImmediatePropagation (e.g. Android 2)
event.propagationStopped = true;
}
// Cancel the event
event.stopPropagation();
event.preventDefault();
```
除了这些还判断是否是focus事件,textaera事件等等,
还有兼容性到了iso4...