uniapp滑动操作
<view @touchmove="handletouchmove" @touchstart="handletouchstart" @touchend="handletouchend">
</view>
data() {
return {
flag: 0,//1向左滑动,2向右滑动,3向上滑动 4向下滑动
text: '',//向哪里滑动
lastX: 0,
lastY: 0,
index:0
}
}
methods: {
handletouchmove: function(event) {
// console.log(event)
if (this.flag !== 0) {
return;
}
let currentX = event.changedTouches[0].pageX;
let currentY = event.changedTouches[0].pageY;
let tx = currentX - this.lastX;
let ty = currentY - this.lastY;
let text = '';
this.mindex = -1;
//左右方向滑动
if (Math.abs(tx) > Math.abs(ty)) {
if (tx < 0) {
text = '向左滑动';
this.flag = 1;
// this.getList(); //调用列表的方法
} else if (tx > 0) {
text = '向右滑动';
this.flag = 2;
}
}
//上下方向滑动
else {
if (ty < 0) {
text = '向上滑动';
this.flag = 3;
// this.getList(); //调用列表的方法
} else if (ty > 0) {
text = '向下滑动';
this.flag = 4;
}
}
//将当前坐标进行保存以进行下一次计算
this.lastX = currentX;
this.lastY = currentY;
this.text = text;
},
handletouchstart: function(event) {
// console.log(event)
this.lastX = event.changedTouches[0].pageX;
this.lastY = event.changedTouches[0].pageY;
},
handletouchend: function(event) {
this.flag = 0;
this.text = '没有滑动';
},
}
uniapp滑动操作的更多相关文章
- iOS之UITableView带滑动操作菜单的Cell
制作一个可以滑动操作的 Table View Cell 本文翻译自 http://www.raywenderlich.com/62435/make-swipeable-table-view-cell- ...
- Android 屏蔽ScrollView滑动操作
屏蔽ScrollView滑动操作,如下,会用到ViewConfiguration这个类,这个类可以获取到用户是否为滑动操作的临界值. 代码如下: package com.xx.uikit.view; ...
- appium滑动操作(向上、向下、向左、向右)
appium滑动操作(向上滑动.向下滑动.向左滑动.向右滑动) 测试app:今日头条apk 测试设备:夜游神模拟器 代码如下: 先用x.y获取当前的width和height def getSize() ...
- 微信小程序开发-滑动操作
在实际应用中,当某种手势被触发后,在用户没有放开鼠标或手指前,会一直识别为该手势.比如当用户触发左滑手势后,这时再向下滑动,仍要按照左滑手势来处理. 可以定义一个标记来记录第一次识别到的手势,如果已识 ...
- Appium-Java滑动操作
Java滑动操作,通常可以直接使用API中AndroidDriver类中的swipe方法,直接进行调用 swipe(int startx, int starty, int endx, int endy ...
- 制作一个可以滑动操作的 Table View Cell
本文转载至 https://github.com/nixzhu/dev-blog Apple 通过 iOS 7 的邮件(Mail)应用介绍了一种新的用户界面方案——向左滑动以显示一个有着多个操作的菜单 ...
- python+Appium自动化:app滑动操作swipe
swipe Appium使用滑动操作用到了swipe方法,定义如下: swipe(self, start_x, start_y, end_x, end_y, duration=None) 从一个点滑动 ...
- Android SwipeActionAdapter结合Pinnedheaderlistview实现复杂列表的左右滑动操作
在上一篇博客<Android 使用SwipeActionAdapter开源库实现简单列表的左右滑动操作>里,已经介绍了利用SwipeActionAdapter来左右滑动操作列表: 然,有时 ...
- Android 使用SwipeActionAdapter开源库实现简单列表的左右滑动操作
我们做listview左右滑动操作时,一般中情况下,都是像QQ那样,左滑弹出操作菜单(删除.编辑),然后选择菜单操作: 这样的效果不可谓不好,算是非常经典. 另外,有少数的APP,尤其是任务管理类的A ...
随机推荐
- Java读文件写入kafka
目录 Java读文件写入kafka 文件格式 pom依赖 java代码 Java读文件写入kafka 文件格式 840271 103208 0 0.0 insert 84e66588-8875-441 ...
- Hive(五)【DQL数据查询】
目录 一. 基本查询 1.1 算数运算符 1.2 常用聚合函数 1.3 limit 1.4 where 1.5 比较运算符(between|in|is null) 1.6 LIKE和RLIKE 1.7 ...
- Linux基础命令---ntpq查询时间服务器
ntpq ntpq指令使用NTP模式6数据包与NTP服务器通信,能够在允许的网络上查询的兼容的服务器.它以交互模式运行,或者通过命令行参数运行. 此命令的适用范围:RedHat.RHEL.Ubuntu ...
- shell条件测试语句实例-测试apache是否开启
终于理解了shell条件测试语句"!="和"-n"的用法区别,于是有了如下的shell脚本,做为练习. 第一种方法:测试apache是否开启?字符串测试 #!/ ...
- 【Linux】【Services】【Project】Haproxy Keepalived Postfix实现邮件网关Cluster
1. 简介: 1.1. 背景:公司使用exchange服务器作为邮件服务器,但是使用Postfix作为邮件网关实现病毒检测,内容过滤,反垃圾邮件等功能.原来的架构非常简单,只有两台机器,一个负责进公司 ...
- 使用AOP思想实现日志的添加
//1.创建日志表syslog------->创建日志的实体类--------->在web.xml中配置监听 <listener> <listener-class ...
- Mysql一致性效验_pt工具
目录 一.简介 二.原理介绍 三.选项 四.环境 五.部署 一.简介 pt工具可以随机抽取主从的数据进行对比,用于测试主从数据一致性.也可以对不一致数据进行修复.这个工具在主或者从上安装均可 二.原理 ...
- Nginx编译添加新模块
目录 一.简介与思路 一.简介与思路 当前适用于nginx已经在安装过了,如果没安装过,直接在编译时候添加模块即可. Nginx主要程序就是nginx这个二进制脚本,只要在编译一个nginx脚本替换掉 ...
- iOS-启动项目(一)设置 rootViewController
摘要 刚创建一个新的项目,在 AppDelegate 中设置 rootViewController 来确定应用的首页是一个最基本的处理,因为是不常操作的处理,所以容易忽略其中的某个步骤,导致无法设置成 ...
- Android工具 - 随机测试(猴子)
原创文章,如有转载,请注明出处:http://blog.csdn.net/yihui823/article/details/6697535 本文章的前提:已经安装了Eclipse和ADT.androi ...