使用vue-touch实现移动端左右滑动屏幕切换页面

1.安装vue-touch

npm install vue-touch@next --save

2.在main.js中引入

import  VueTouch from 'vue-touch'
Vue.use(VueTouch,{name:'v-touch'})
VueTouch.config.swipe = {
  threshold:50  //设置左右滑动的距离
}

3.在路由的index.js中

import Vue from 'vue'
import Router from 'vue-router'
import HelloWorld from '@/components/HelloWorld'
import GoodsList from '@/view/GoodList'
import GoodDetail from '@/view/GoodDetail'

Vue.use(Router)

export default new Router({
  routes: [
    {
      path: '/',
      name: 'HelloWorld',
      component: HelloWorld
    },{
      path:'/goods',
      name:'GoodsList',
      component:GoodsList
    },{
      path:'/detail',
      name:'GoodDetail',
      component:GoodDetail
    }
  ]
})

4.在某页面中