一:安装
1、npm install vue-touch@next -S
二: main.js引入
1、import
VueTouch from
'vue-touch'
2、Vue.use(VueTouch, {name:
'v-touch'
})
三:参考代码
<template>
<v-touch v-on:swipeup="swiperup" v-on:swipedown="swiperdown" class="wrapper v-touch" tag="div">
</v-touch>
</template>
<script>
export default {
data () {
return {
}
},
methods: {
swiperup: function () {
this.$router.push({ path: '/media' })
},
swiperdown: function () {
this.$router.push({ path: '/index' })
}
}
}
</script>
<style lang="scss" scoped>
.v-touch{
height: 100vh;
background: greenyellow;
}
</style>
四:注意
v-touch要有高度撑开才能生效上下滑动事件,最新的不需要加
.v-touch {
touch-action: pan-y !important;
}