栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > JavaScript

vue2.0移动端滑动事件vue-touch的实例代码

JavaScript 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

vue2.0移动端滑动事件vue-touch的实例代码

Vue-touch的使用

有时候我们不止需要有返回键,也要有手势滑动切换页面的功能时,这个时候vue-touch就派上用场了

API地址:

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

安装

npm insall vue-touch@next --save
//main.js中引入:
import VueTouch from 'vue-touch'
Vue.use(VueTouch, {name: 'v-touch'})

用法如下:

//html代码


export default {
 name: 'Queue',
 data () {
  return {
  }
 },
 methods: {
  swiperleft: function () {
   this.$router.push({'path':'/queuehistory'});
  },
  swiperright: function () {
   this.$router.push({'path':'/home'});
  }
 }
}

下面给大家介绍下vue2.0移动端滑动事件vue-touch,具体内容如下所述:

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

cnpm install vue-touch@next

var VueTouch = require('vue-touch')
Vue.use(VueTouch, {name: 'v-touch'})

//左划   默认渲染为div  data为参数
Swipe me!
//点击  渲染为一个a标签
Tap me!
//点击  渲染为p标签
Tap me!

总结

以上所述是小编给大家介绍的vue2.0移动端滑动事件vue-touch的实例代码,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!

转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/78120.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号