Vue-touch is the easiest way to use Hammer.js with the excellent Vue.js framework, it's essential to make decent mobile app. Compatible with Vue.js 1.x. This repo is perfect to understand the directive concept of VueJS, for a more comprehensive touch binding, Evan You updated the official just after I made this one : https://github.com/vuejs/vue-touch/

Vue-touch adds the v-touch:event directive to your vue instance. You can easily play with tap doubletap press swipe swiperight swipeleft and more.

Just add vue-touch.min.js to your project after vue.min.js. It includes a fresh version of Hammer.

<script src="lib/vue.min.js"></script>
<script src="lib/vue-touch.min.js"></script>

<div id="app">
  <span v-touch:swipeleft="plus()" v-touch:swiperight="moins()" v-model="number">{{ number }}</span>
</div>

var app = new Vue({
  el: '#app',
  data : {
    number: 1
  },
  methods : {
    plus : function(){
      this.number++
    },
    moins : function(){
      this.number--
    }
  }
})

Vue.js https://github.com/vuejs/vue
Hammer.js https://github.com/hammerjs/hammer.js

MIT

Copyright © 2016 Didier Franc