From b4c69859ae2ebdb080d33b8254ef226514e85728 Mon Sep 17 00:00:00 2001 From: kfd Date: Thu, 22 Aug 2024 17:27:08 +0800 Subject: [PATCH] fix(to-drag): ignore adsorb compute when without moving --- packages/to-drag/index.ts | 8 ++++++-- src/pages/to-drag/example/example6.vue | 2 ++ 2 files changed, 8 insertions(+), 2 deletions(-) diff --git a/packages/to-drag/index.ts b/packages/to-drag/index.ts index 6d47945..dc27b90 100644 --- a/packages/to-drag/index.ts +++ b/packages/to-drag/index.ts @@ -54,6 +54,7 @@ export class ToDrag { height = 0 maxX = 0 maxY = 0 + needComputeAdsorb = true // 是否需要计算吸附, 只有产生了Move才需要计算 private options: ToDragOptions private scrollbarWidth: number private startX = 0 @@ -158,6 +159,7 @@ export class ToDrag { } setStartInfo (x: number, y: number, e?: TouchEvent | MouseEvent) { + this.needComputeAdsorb = false this.setPosition(); this.setLimit(); this.startX = x - this.left; @@ -176,6 +178,7 @@ export class ToDrag { return; } e.preventDefault(); + this.needComputeAdsorb = true let dragX, dragY; const x = this.isTouch ? (e as TouchEvent).changedTouches[0].clientX : (e as MouseEvent).x; const y = this.isTouch ? (e as TouchEvent).changedTouches[0].clientY : (e as MouseEvent).y; @@ -211,6 +214,7 @@ export class ToDrag { handleAdsorb () { // if (this.options.isAbsolute) return; + if (!this.needComputeAdsorb) return const endPoint = [this.left + this.width / 2, this.top + this.height / 2]; let maxX = 0 let maxY = 0 @@ -337,14 +341,14 @@ const mounted = (el: HTMLElement, binding: DirectiveBinding, userOptions?: ToDra ...customGlobalOptions, ...value }; - (el as any).$toDarg = new ToDrag({ + (el as any).$toDrag = new ToDrag({ el, options }); }; const unmounted: DirectiveHook = (el: any) => { - el.$toDarg && el.$toDarg.destroy(); + el.$toDrag && el.$toDrag.destroy(); }; export const ToDragDirective: ObjectDirective = { diff --git a/src/pages/to-drag/example/example6.vue b/src/pages/to-drag/example/example6.vue index 476b111..b685c04 100644 --- a/src/pages/to-drag/example/example6.vue +++ b/src/pages/to-drag/example/example6.vue @@ -18,6 +18,8 @@ export default defineComponent({ return { options: { isAbsolute: true, + // adsorb: 2, + // adsorbOffset: 10, needComputeBorder: true // default is true, will compute parent border width } };