Vue 实现移动端左右滑动切换
Vue 实现移动端左右滑动切换实现这个功能需要用到touch指令,这个是面向vue2.0的touch指令,是基于touchjs(移动端手势库)。安装以及引入vue-touchnpm install vue-touch@next --save//在vue项目中的main.js文件中引入:import VueTouch from 'vue-touch'Vue.us...
·
Vue 实现移动端左右滑动切换
实现这个功能需要用到touch指令,这个是面向vue2.0的touch指令,是基于touchjs(移动端手势库)。
- 安装以及引入vue-touch
npm install vue-touch@next --save
//在vue项目中的main.js文件中引入:
import VueTouch from 'vue-touch'
Vue.use(VueTouch, {name: 'v-touch'})
2.使用vue-touch
直接贴上实例代码:
<v-touch v-on:swipeleft="onSwipeLeft" v-on:swiperight="onSwipeRight" >
<div class="content" >
</div>
</v-touch>
method:{
onSwipeLeft: function () {//左滑动
//写入向左滑触发事件
//例如跳转页面
},
onSwipeRight: function () {//右滑动
},
},
}
更多推荐
已为社区贡献5条内容
所有评论(0)