vue監聽手指滑動vue-touch的使用

因爲須要監聽手指的左右滑動事件,因此用到了v-touch這個插件。

npm安裝

npm install vue-touch@next --save
//main.js中引入:
import VueTouch from 'vue-touch'
Vue.use(VueTouch, {name: 'v-touch'})

用法以下:

//html代碼
<template>
  <v-touch v-on:swipeleft="swiperleft" v-on:swiperight="swiperright" class="wrapper">
      <div class="menu-container" ref="menuContainer">    
    <!-- 這個是內容 -->  
      </div>
  </v-touch>
</template>

js

export default {
  name: 'Queue',
  data () {
    return {
    
    }
  },
  methods: {
    swiperleft: function () {
     console.log("左劃")
    },
    swiperright: function () {
     console.log("右滑")
    }
  }

}
相關文章
相關標籤/搜索