美文网首页
「优化」优化左右滑动效果

「优化」优化左右滑动效果

作者: ybrelax | 来源:发表于2018-12-06 15:19 被阅读0次
  • 通过vue-touch来进行优化

https://github.com/vuejs/vue-touch/tree/next

var VueTouch = require('vue-touch')
Vue.use(VueTouch, {name: 'v-touch'}
//左划      默认渲染为div   data为参数
<v-touch v-on:swipeleft="onSwipeLeft(data)">Swipe me!</v-touch>
//点击   渲染为一个a标签
<v-touch tag="a" v-on:tap="onTap">Tap me!</v-touch>
//点击   渲染为p标签
<v-touch tag="p" v-on:tap="onTap">Tap me!</v-touch>

注意一点:touch-action: pan-y!important (解决上下不能滑动的问题) 在v-touch 加上这个css属性
ios解决上下不能滑动 :swipe-options="{direction: 'horizontal'}"

相关文章

网友评论

      本文标题:「优化」优化左右滑动效果

      本文链接:https://www.haomeiwen.com/subject/abjocqtx.html