From db9c32f671e1206e629a3c2a0c7ed4f096f76e5e Mon Sep 17 00:00:00 2001 From: duenyang <377153400@qq.com> Date: Mon, 23 Sep 2024 17:31:16 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E9=99=90=E5=88=B6=E5=8F=AA=E6=B3=A8?= =?UTF-8?q?=E5=86=8C=E4=B8=80=E6=AC=A1transition=E4=BA=8B=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/omi-transition/src/index.tsx | 20 ++++++++------------ 1 file changed, 8 insertions(+), 12 deletions(-) diff --git a/packages/omi-transition/src/index.tsx b/packages/omi-transition/src/index.tsx index 13e6b3c2e..fe4127803 100644 --- a/packages/omi-transition/src/index.tsx +++ b/packages/omi-transition/src/index.tsx @@ -14,13 +14,17 @@ interface TransitionOptions { } -registerDirective('transition', (dom: DomType, options: TransitionOptions) => { +registerDirective('transition', debounce((dom: DomType, options: TransitionOptions) => { + // 限制只注册一次transition事件 + if(dom["__registed"]) return; + dom["__registed"] = true; + const { name, delay = 0 } = options const observer = new MutationObserver((mutations) => { mutations.forEach((mutation) => { if (mutation.type === 'attributes' && mutation.attributeName === 'show') { const show = getShowAttribute(dom) - dom["__updateClasses"](dom, name, show, delay, options) + updateClasses(dom, name, show, delay, options) } }) }) @@ -52,17 +56,9 @@ registerDirective('transition', (dom: DomType, options: TransitionOptions) => { // 将 onTransitionEnd 函数存储在元素上 dom['__onTransitionEnd'] = onTransitionEnd - // 清除旧的方法 - if(dom["__updateClasses"]){ - dom["__updateClasses"] = null; - } - - // 给每个dom添加方法,增加debounce防止enter和leave同时多次触发 - dom["__updateClasses"] = debounce(updateClasses, 0); - const show = getShowAttribute(dom) - dom["__updateClasses"](dom, name, show, delay, options) -}) + updateClasses(dom, name, show, delay, options) +}, 0)); function getShowAttribute(dom: HTMLElement | Component<{ show: boolean }>): boolean { return dom.getAttribute('show') === 'true' ||