vue tap事件的实现

最新推荐文章于 2024-08-19 09:00:00 发布

遥望星辰_

最新推荐文章于 2024-08-19 09:00:00 发布

阅读量2.3w

点赞数 2

分类专栏： JavaScript 文章标签： javascript vue tap

本文链接：https://blog.csdn.net/qq_32262127/article/details/79098673

版权

本文介绍了如何创建一个vue-tap.js插件，用于在移动端模拟click事件并解决点击延迟问题。该插件仅适用于Vue 2.0+，代码简洁，并提供了github链接供参考。虽然fastclick是一个更成熟的解决方案，但此vue-tap插件体积小，适合作为实践项目。

摘要由CSDN通过智能技术生成

前两天做了个tap.js插件，实现了移动端touch事件模拟click事件，解决点击延迟的问题，但是在vue中并不能用v-tap来调用，所以今天做了vue版的vue-tap.js。此前也曾用过其他的插件来实现v-tap，但方式仍有些累赘，于是便用了更简洁的方式来实现，下面附上代码（只支持vue2.0+）。

vue-tap.js

/*!
 * vue-tap.js
 * by weijianhua  https://github.com/weijhfly/vue-tap
*/
;(function (factory) {
	if (typeof define === 'function' && define.amd) {
		define(function(){return factory;});
	}else if (typeof exports == "object") {
		module.exports = factory;
	}else{
		Vue.use(factory);
	}
}({
   master:{
		bind: function (el, binding) {
			var isTouch = "ontouchend" in document;
			el.exec = function (e) {
				var data = binding.value;
				data[0].apply(this, data.slice(1));
			};
			if (isTouch) {
				//touchstart
				el.addEventListener('touchstart', function (e) {
					binding.modifiers.stop && (e