当您按路线更改页面时反应CSSTransition

时间:2020-05-21 19:36:41

标签: javascript reactjs react-router reactcsstransitiongroup page-transition

我正在使用CSSTransition,它在组件上的使用效果惊人:

<CSSTransition timeout={330} in={state.isPopupOpen} classNames="popup" unmountOnExit>
    <MyComponent />
</CSSTransition>

我想知道在我通过CSSTransition打开/关闭页面时是否可以使用Route进行良好的过渡:

<BrowserRouter>
    <Switch>
        <Route path="/page1">
            <CSSTransition timeout={330} in={state.isPageOpen} classNames="page" unmountOnExit>
                <Page1 />
            </CSSTransition>
        </Route>
        <Route path="/page2">
            <Page2 />
        </Route>
    <Switch>
</BrowserRouter>

<Link to="/page1">Link example</Link>

我尝试没有成功。这样无法使用CSSTransition吗?您还有其他类似的解决方案吗?

0 个答案:

没有答案
相关问题