``` function vueTouch(el,binding,type){//觸屏函數 var _this=this; this.obj=el; this.binding=binding; this.touchType=type; this.vueTouches={x:0,y:0};//觸屏坐標 this.vueMoves=true; this.vueLeave=true; this.vueCallBack=typeof(binding.value)=="object"?binding.value.fn:binding.value; this.obj.addEventListener("touchstart",function(e){ _this.start(e); },false); this.obj.addEventListener("touchend",function(e){ _this.end(e); },false); this.obj.addEventListener("touchmove",function(e){ _this.move(e); },false); }; vueTouch.prototype={ start:function(e){//監聽touchstart事件 this.vueMoves=true; this.vueLeave=true; this.longTouch=true; this.vueTouches={x:e.changedTouches[0].pageX,y:e.changedTouches[0].pageY}; this.time=setTimeout(function(){ if(this.vueLeave&&this.vueMoves){ this.touchType=="longtap"&&this.vueCallBack(this.binding.value,e); this.longTouch=false; }; }.bind(this),1000); }, end:function(e){//監聽touchend事件 var disX=e.changedTouches[0].pageX-this.vueTouches.x;//計算移動的位移差 var disY=e.changedTouches[0].pageY-this.vueTouches.y; clearTimeout(this.time); if(Math.abs(disX)>10||Math.abs(disY)>100){//當橫向位移大于10，縱向位移大于100，則判定為滑動事件 this.touchType=="swipe"&&this.vueCallBack(this.binding.value,e);//若為滑動事件則返回 if(Math.abs(disX)>Math.abs(disY)){//判斷是橫向滑動還是縱向滑動 if(disX>10){ this.touchType=="swiperight"&&this.vueCallBack(this.binding.value,e);//右滑 }; if(disX<-10){ this.touchType=="swipeleft"&&this.vueCallBack(this.binding.value,e);//左滑 }; }else{ if(disY>10){ this.touchType=="swipedown"&&this.vueCallBack(this.binding.value,e);//下滑 }; if(disY<-10){ this.touchType=="swipeup"&&this.vueCallBack(this.binding.value,e);//上滑 }; }; }else{ if(this.longTouch&&this.vueMoves){ this.touchType=="tap"&&this.vueCallBack(this.binding.value,e); this.vueLeave=false }; }; }, move:function(e){//監聽touchmove事件 this.vueMoves=false; } }; Vue.directive("tap",{//點擊事件 bind:function(el,binding){ new vueTouch(el,binding,"tap"); } }); Vue.directive("swipe",{//滑動事件 bind:function(el,binding){ new vueTouch(el,binding,"swipe"); } }); Vue.directive("swipeleft",{//左滑事件 bind:function(el,binding){ new vueTouch(el,binding,"swipeleft"); } }); Vue.directive("swiperight",{//右滑事件 bind:function(el,binding){ new vueTouch(el,binding,"swiperight"); } }); Vue.directive("swipedown",{//下滑事件 bind:function(el,binding){ new vueTouch(el,binding,"swipedown"); } }); Vue.directive("swipeup",{//上滑事件 bind:function(el,binding){ new vueTouch(el,binding,"swipeup"); } }); Vue.directive("longtap",{//長按事件 bind:function(el,binding){ new vueTouch(el,binding,"longtap"); } }); ```