diff --git a/uni_modules/cool-ui/hooks/index.ts b/uni_modules/cool-ui/hooks/index.ts index 17b1a58..598f801 100644 --- a/uni_modules/cool-ui/hooks/index.ts +++ b/uni_modules/cool-ui/hooks/index.ts @@ -2,4 +2,5 @@ export * from "./component"; export * from "./form"; export * from "./page"; export * from "./size"; +export * from "./touch"; export * from "./ui"; diff --git a/uni_modules/cool-ui/hooks/touch.ts b/uni_modules/cool-ui/hooks/touch.ts new file mode 100644 index 0000000..b54e1f9 --- /dev/null +++ b/uni_modules/cool-ui/hooks/touch.ts @@ -0,0 +1,42 @@ +export class Touch { + // 触摸起始Y坐标 + startY = 0; + // 触摸起始X坐标 + startX = 0; + // 横向滑动参数 + horizontal = 0; + + start(e: UniTouchEvent) { + this.startX = e.touches[0].clientX; + this.startY = e.touches[0].clientY; + this.horizontal = 0; + } + + move(e: UniTouchEvent) { + const x = this.startX - e.touches[0].clientX; + + if (this.horizontal == 0) { + // 只在horizontal=0时判断一次 + const y = this.startY - e.touches[0].clientY; + + if (Math.abs(x) > Math.abs(y)) { + // 如果x轴移动距离大于y轴移动距离则表明是横向移动手势 + this.horizontal = 1; + } + + if (this.horizontal == 1) { + // 如果是横向移动手势,则阻止默认行为(防止页面滚动) + e.preventDefault(); + } + } + } + + end() { + this.startY = 0; + this.horizontal = 0; + } +} + +export function useTouch(): Touch { + return new Touch(); +}