问题描述
我需要在嵌套路由中做一些动画（使用 react-transition-group v5.2.0，这是值得的）。
按照示例，在 react-transition-group docs 中，我可以使用 prob_word_given_doc = np.asarray(self.sparse_weighted_matrix / self.sparse_weighted_matrix.sum(1))
获得常规路线动画，但对于嵌套路线则不能这样说。它们只是没有动画，并且它们来自 Csstransition 的预期类没有按预期注入组件中（Csstransition、*-enter、*-enter-active、*-exit）。
我当前带有嵌套路由的组件如下所示：
*-exit-active这里还有一个 sandbox app，它也基于文档中的简单路由示例。
我想要的是每次更新嵌套路由时在 className function Example () {
const { params } = useRoutematch() || {}
const history = useHistory()
return (
<>
[EXISTING_CONTENT]
<button onClick={()=> goToTheNextRoute()}>Click me!</button>
<Route path="/example/:nestedId">
{({ location }) => {
const { pathname } = location
return (
<Csstransition
in={pathname.includes(params?.nestedId)}
timeout={500}
classNames="nested-animation"
mountOnEnter
unmountOnExit
>
<div className="nested-animation">
My nested routes I'd like to animate at every click:
<h3>Current nested Route: {params?.nestedId}</h3>
</div>
</Csstransition>
)
}}
</Route>
</>
)
}
的 div 上有一个动画。
解决方法
暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！
如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@）