uniapp下的手势事件

uniapp下的手势事件

实现了上滑下滑左滑右滑的事件识别

复制代码
定义return

				touchStartX: 0, // 触屏起始点x  
				touchStartY: 0, // 触屏起始点y 
绑定事件
<view @touchstart="touchStart" @touchend="touchEnd">

方法代码
/**
			 * 触摸开始  
			 **/
			touchStart(e) {
				console.log("触摸开始")
				this.touchStartX = e.touches[0].clientX;
				this.touchStartY = e.touches[0].clientY;
			},
			/**  
			 * 触摸结束  
			 **/
			touchEnd(e) {
				let _this = this;
				console.log("触摸结束")
				let deltaX = e.changedTouches[0].clientX - this.touchStartX;
				let deltaY = e.changedTouches[0].clientY - this.touchStartY;
				if (Math.abs(deltaX) > 50 && Math.abs(deltaX) > Math.abs(deltaY)) {
					if (deltaX >= 0) {
						console.log("左滑")
					} else {
						console.log("右滑")
					}
				} else if (Math.abs(deltaY) > 50 && Math.abs(deltaX) < Math.abs(deltaY)) {
					if (deltaY < 0) {
						console.log("上滑")
					} else {
						console.log("下滑")
					}
				} else {
					console.log("可能是误触!")
				}
			},
相关推荐
.生产的驴5 分钟前
泛微E10二开 前端Ecode拦截器
前端
亿元程序员11 分钟前
PinK(Cocos4.0?)生成飞机大战,抢先体验全流程!
前端
晓得迷路了15 分钟前
栗子前端技术周刊第 111 期 - Next.js 16.1、pnpm 10.26、Bun 1.3.5...
前端·javascript·bun
CodeSheep23 分钟前
中国四大软件外包公司
前端·后端·程序员
七月shi人24 分钟前
使用Node版本管理包n,在MAC电脑权限问题
前端·macos
shangxianjiao25 分钟前
vue前端项目介绍项目结构
前端·javascript·vue.js
Mike_jia33 分钟前
4ga Boards:重新定义高效协作的实时看板工具实战指南
前端
袖手蹲35 分钟前
Arduino UNO Q使用Streamlit构建WebUI:零前端经验打造交互式硬件控制
前端
大布布将军39 分钟前
⚡️编排的艺术:BFF 的核心职能——数据聚合与 HTTP 请求
前端·网络·网络协议·程序人生·http·node.js·改行学it
冒冒菜菜44 分钟前
RSAR的前端可视化界面
前端