我的代码
<Collapse
in={expanded}
onTransitionEnd={() => console.log('finished')}
>
<div>foo</div>
</Collapse>
问题是什么
折叠动画完成后回调函数(onTransitionEnd)没有被调用。
应该怎么做?
<Collapse
in={expanded}
onTransitionEnd={() => console.log('finished')}
>
<div>foo</div>
</Collapse>
折叠动画完成后回调函数(onTransitionEnd)没有被调用。
应该怎么做?
我也期望 addEndListener
(Collapse API) 在动画之后触发,但事实并非如此。与Sereyn的答案类似,对我有用的是:
<Collapse
onEntered={() => console.log("expand animation done")}
onExited={() => console.log("collapse animation done")}
in={checked}
>
{icon}
</Collapse>
onTransitionEnd
这样的属性。addEndListener
属性,在'in'和'out'动画结束时触发。或者你可以使用onExited
属性,在'out'动画结束时触发。请注意,不要删除HTML标签。 <Collapse
addEndListener={() => console.log("done")}
onExited={() => console.log("finished")}
in={checked}
>
{icon}
</Collapse>