嵌套switch可以使用换页动画吗？

Question

我对换页动画有疑问我现在正在为我的动画使用 react-transition-group。 app.jsx 中的那个效果很好，但我尝试将另一个动画应用到 main.jsx 但它不起作用。另一个可以帮忙吗？

App.jsx

  <CSSTransition key={currentkey}  classNames={"fade"} timeout={1000}>
     <section className="route-section">
       <Switch location={this.props.location} >
         <Route path="/main" component={Main} />
         <Route exact path="/login" component={Login} />
            <Redirect exact from="/" to="/login" />
       </Switch>
      </section>
  </CSSTransition>
  </TransitionGroup>

Main.jsx

 <TransitionGroup className="trantision-group">
      <CSSTransition key={currentkey}  classNames={"fade"} timeout{1000}>
         <section className="route-section">
              <Switch >
                 <Route path="/main/env"  component={Env} />
                 <Route path="/main/home" component={Home}  />
                      <Redirect exact from="/main" to="/main/env" />
                 </Switch>
         </section>
        </CSSTransition>
 </TransitionGroup >

Answer 1

当您正在寻找整页转换时，一个很好的解决方案是 react-transition-group。

它可以轻松地从一个页面过渡到另一个页面。

<Link
  to="/some-path"
  transition="glide-right"
/>

当前页面退出，下一页进入

演示：

PS: 包是我写的

嵌套switch可以使用换页动画吗？

Can nested switch use change page animation?

reactjs

react-router

react-transition-group