首页 > 解决方案 > 路由未在嵌套路由组件内加载组件

问题描述

我正在加载我的adminDashboard组件。现在基于 URL,我想渲染一些组件。但是,它没有加载任何组件。此外,chrome 控制台中的网络选项卡上没有任何活动。app.jsRouteadminDashboard

如果我在没有 Route 的情况下渲染它们,它们会正确渲染。

应用程序.js

class App extends Component {

  render() {
    let { error, success } = this.props;
    const Admin = Authorization(['admin'])
    return (
      <div className='app'>
        <AdminNavbar logout={this.props.logout}/>
        <Switch>
          <Route exact path='/admin/signin' render={(props) => {
              return <AuthForm />
            }}
          />
          <Route exact path='/admin' component={Admin(AdminDashboard)} />
        </Switch>
        <Footer />
      </div>
    );
  }
}

MyComponent 组件

const MyDashboard = (props)=> ` this is dashboard`

管理仪表板

class AdminDashboard extends Component{
    render() {
        return (
            <div>
                <div className='row'>
                    <div className='col-md-2'>
                        <NavBar  />
                    </div>
                    <div className='col-md-10'>
                        < Commisions /> //working properly if i load it without route
                        <Switch>

                            <Route exact path='/admin/dashboard' component={MyDashboard} /> // not work
                            //some other route
                        </Switch>
                    </div>
                </div>
            </div>
        )
    }
}

标签: reactjsreact-router-dom

解决方案


推荐阅读