最近项目中,有的页面发现设置返回键看起来怪怪的,感觉与整体不协调,于是就考虑使用手势滑动事件来实现返回功能~

开叉查阅资料~找到了vue-touch,使用起来可谓是简单粗暴啊,适合我这样的快速开发人员,源码地址:

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

不过要看清楚了,vue2.0之后的要使用next分支才行,之前的使用master分支即可

npm insall vue-touch@next --save

然后再main.js中引入:

import VueTouch from 'vue-touch'
Vue.use(VueTouch, {name: 'v-touch'})

之后在任何组件内都可以按照下方的方式进行使用啦

left,right为自己定义的左右滑动时触发的回调函数,可执行自定义方法,更多的方法以及详细使用规则请参考上方的github地址

Vue之Vue-touch的使用的更多相关文章

  1. vue | 基于vue的城市选择器和搜索城市对应的小区

    城市选择器应该是比较常用的一个组件,用户可以去选择自己的城市,选择城市后返回,又根据自己选择的城市搜索小区. 功能展示 这是选择结果 这是选择城市 这是搜索小区 这是搜索小区接口,key为城市名字,i ...

  2. vue入门 vue与react和Angular的关系和区别

    一.为什么学习vue.js vue.js兼具angular.js和react的优点,并且剔除了他们的缺点 官网:http://cn.vuejs.org/ 手册:http://cn.vuejs.org/ ...

  3. Vue (三) --- Vue 组件开发

    ------------------------------------------------------------------好心情,会让你峰回路转. 5. 组件化开发 5.1 组件[compo ...

  4. vue学习:vue+webpack的快速使用指南(新手向)

    一.vue有两种使用方式: 1.下载vue.js <script src="vue.js"></script> 2.使用npm npm install vu ...

  5. Vue 项目 Vue + restfulframework

    Vue 项目 Vue + restfulframework 实现登录认证 - django views class MyResponse(): def __init__(self): self.sta ...

  6. 【vue】vue +element 搭建项目,组件之间通信

    父子组件通信 父 通过props属性给 子传递数据 子 操作 父  this.$parent.XXX 子通过$emit传递参数 或者通过vue-bus vue-bus既可以实现父子组件之间的通信,也可 ...

  7. 【vue】vue +element 搭建项目,vuex中的store使用

    概述: 每一个 Vuex 应用的核心就是 store(仓库).“store”基本上就是一个容器,它包含着你的应用中大部分的状态 (state).Vuex 和单纯的全局对象有以下两点不同: Vuex 的 ...

  8. vue的.vue文件是怎么run起来的(vue-loader)

    vue的.vue文件是怎么run起来的(vue-loader) 引子:vue的.vue文件是怎么跑起来的? 答:通过vue-loader,解析.vue文件,在webpack解析,拆解vue组件 1.v ...

  9. vue学习之用 Vue.js + Vue Router 创建单页应用的几个步骤

    通过vue学习一:新建或打开vue项目,创建好项目后,接下来的操作为: src目录重新规划——>新建几个页面——>配置这几个页面的路由——>给根实例注入路由配置 src目录重整 在项 ...

  10. python 全栈开发,Day89(sorted面试题,Pycharm配置支持vue语法,Vue基础语法,小清单练习)

    一.sorted面试题 面试题: [11, 33, 4, 2, 11, 4, 9, 2] 去重并保持原来的顺序 答案1: list1 = [11, 33, 4, 2, 11, 4, 9, 2] ret ...

随机推荐

  1. ROS上利用usb_cam读取摄像头图像

    电脑需要有USB3.0的接口 我使用的环境为:Ubuntu16.04LTS ROS版本是kinetic 一.usb_cam驱动的安装 1.创建ROS工作空间 mkdir -p myros/src cd ...

  2. Keepalived + Nginx + Tomcat 高可用负载均衡架构

    环境: 1.centos7.3 2.虚拟ip:192.168.217.200 3.192.168.217.11.192.168.217.12上分别部署Nginx Keepalived Tomcat并进 ...

  3. java 使用 spirng 监控 cpu 使用 状态。。。。

    首先..使用 sigar ,sigar 使用  要 注意区分 是 web 还是 本地..最好 在 WEB-INF 下 复制 dll 文件..因为WEB-INF 不会被压缩... try { //如果是 ...

  4. springcloud中常用的注解@

    @SpringBootApplication是springboot启动类,包括三个注解,他们的作用分别是: @Configuration:表示将该类作用springboot配置文件类 @EnableA ...

  5. eclipse ctrl+h

    之前我的eclipse使用ctrl + h 出现的总是Plug-in Search ,总是需要点那个小三角才能找到File Search ,深感使用不便, 修改方法:Window->Genera ...

  6. 三,JVM 自带命令行工具之JMap

    jmap:java内存映像工具 jmap(Memory Map for java ) 命令用于生成堆转储快照(一般被称为headdump 或dump文件) jmap命令格式:jmap [option ...

  7. 华为云kafka POC 踩坑记录

    2019/03/08 18:29 最近在进行华为云相关POC验证,个人主要负责华为云DMS kafka相关.大致数据流程是,从DIS取出数据,进行解析处理,然后放入kafka,再从kafka中取出数据 ...

  8. spring transaction 初识

    spring 事务初识 1.spring事务的主要接口,首先盗图一张,展示出spring 事务的相关接口.Spring并不直接管理事务,而是提供了多种事务管理器,他们将事务管理的职责委托给Hibern ...

  9. linux服务器安装nodejs运行环境

    安装nodejs运行环境 第一步:到node官网下载相应版本的安装包,将安装包放置服务器上,路径为 usr/local/node(可根据自身情况进行修改) 第二步:解压 ***.tar.xz格式文件需 ...

  10. 从零开始的全栈工程师——js篇2.9(this详解)

    this 一.this是js的一个关键字 指定一个对象然后去替代他    只研究函数内的this 分两种 函数内的this和函数外的this1)函数内的this指向行为发生的主体2)函数外的this都 ...