エンドポイントショット、スライド、および長押しイベントの移動

Bubble.vue

これは移動端のクリック、スライド、長押しイベントDemoです.

/*
 * @Author: Rain 
 * @Date: 2019-01-03 20:48:10 
 * @Last Modified by: Rain
 * @Last Modified time: 2019-01-03 20:52:03
 *
 *  、 。
 */
<template>
    <div>
        <button 
        @touchstart="start"   
        @touchmove="move" 
        @touchend="end"
        > 
        </button>
    </div>
</template>

<script>
export default {
name:"Bubble",
data(){
    return{
       longClick:0,  //  
       timeOutEvent: 0,  //  
    }
  },
  methods: {
  start: function(){
    console.log("----start----")
    var that =this;
    this.longClick=0;  //  
    this.timeOutEvent =setTimeout(function(){
        that.longClick=1;  //   
        //  
        console.log(" ")
    },500)
      },
  move:function(e){
    console.log("move")
    clearTimeout(this.timeOutEvent);  //   
    this.timeOutEvent = 0;  //  
    e.preventDefault();  //  
  },
  end:function(){
    console.log("----end----")
    clearTimeout(this.timeOutEvent);  //  
    if(this.timeOutEvent!=0 && this.longClick==0){  //  
         // 
        console.log(' ')
     }
     return false;
    },
  }
}
</script>
<style >

</style>