如何在 React JS 中为私有路由实现动画

Question

我正在尝试在 react js 中找到用于动画渲染不同私有路由的库。我只找到了 CSS 过渡组，但它们仅对开放路线有用。那么是否有一个库可以在 React JS 中为私有路由设置动画

Answer 1

在构造函数中：

constructor() {
    this.state = {
         loading: true
    }
}

在componentDidMount中：

componentDidMount() {
   this.setState({
       loading: false
   })
}

在渲染中

render() {
     return this.state.loading ? 
           <YOUR_ANIMATION_COMPONENT />
           : <YOUR_ROOT_COMPONENT />
}