Skip to content

Commit

Permalink
Merge pull request #924 from duenyang/master
Browse files Browse the repository at this point in the history
fix: omi-transition 动画enter、leave多次同时运行问题修复
  • Loading branch information
dntzhang authored Sep 19, 2024
2 parents 103aad9 + 6675b2f commit 4f29b11
Showing 1 changed file with 10 additions and 3 deletions.
13 changes: 10 additions & 3 deletions packages/omi-transition/src/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ registerDirective('transition', (dom: DomType, options: TransitionOptions) => {
mutations.forEach((mutation) => {
if (mutation.type === 'attributes' && mutation.attributeName === 'show') {
const show = getShowAttribute(dom)
updateClasses(dom, name, show, delay, options)
dom["__updateClasses"](dom, name, show, delay, options)
}
})
})
Expand Down Expand Up @@ -50,11 +50,18 @@ registerDirective('transition', (dom: DomType, options: TransitionOptions) => {
dom.addEventListener('animationend', onTransitionEnd)

// 将 onTransitionEnd 函数存储在元素上

dom['__onTransitionEnd'] = onTransitionEnd

// 清除旧的方法
if(dom["__updateClasses"]){
dom["__updateClasses"] = null;
}

// 给每个dom添加方法,增加debounce防止enter和leave同时多次触发
dom["__updateClasses"] = debounce(updateClasses, 0);

const show = getShowAttribute(dom)
updateClasses(dom, name, show, delay, options)
dom["__updateClasses"](dom, name, show, delay, options)
})

function getShowAttribute(dom: HTMLElement | Component<{ show: boolean }>): boolean {
Expand Down

0 comments on commit 4f29b11

Please sign in to comment.