Question

App Component:
<TransitionGroup>
    <CSSTransition classNames="slide">
        <Switch>
            <Route path='/page1' component={Page1} />
            <Route path='/page2/:tab' component={Page2} />
        </Switch>
    </CSSTransition>
</TransitionGroup>


Page2 Component:
<TransitionGroup>
    <CSSTransition classNames="fade">
        <Switch>
            <Route path='/tab1' component={T1} />
            <Route path='/tab2' component={T2} />
        </Switch>
    </CSSTransition>
</TransitionGroup>

我想要两种类型的动画。页面之间，页面之间的一个选项卡之间。但是，当我单击page2 / tab1或page2 / tab2时，页面的动画（幻灯片）适用。当我想应用标签的动画（淡入淡出）时。有办法解决吗？

Answer 1

您应在“应用程序组件”中使用SwitchTransition而不是TransitionGroup。阅读文档http://reactcommunity.org/react-transition-group/switch-transition

中的第二段

在子路由之间反应CSSTransition

1 个答案: