Reactjs 我面临路由器嵌套的问题？

所以在这里我使用两个浏览器路由器嵌套，当我试图加载它使用链接，但当我试图刷新页面所有内容消失，我无法在屏幕上得到任何东西

这是我的主路由器，我的子路由器在AdminDashboard内

<BrowserRouter>
      <Switch>
        <Route exact path={"/"} render={props => (
          <Login />
        )} />
        <Route exact path={"/registration"} render={props => (
          <Registration />
        )} />
        <Route exact path={"/admin/dashboard"} render={props => (
          <AdminDashboard />
        )} />
        <Route exact path={"/judge/dashboard"} render={props => (
          <JudgeDashboard />
        )} />
        <Route exact path={"/dashboard"} render={props => (
          <StudentDashboard />
        )} />
        </Switch>
      </BrowserRouter>

(
)} />
(
)} />
(
)} />
(
)} />
(
)} />

这是我的管理仪表板组件代码

<BrowserRouter>
      <SideDrawer showSideDrawer={this.state.SideDrawerOpen}/>
      {backDrop}
      <Toolbar drawerClickHandler={this.drawerToggleHandler} SidebarOpen={this.state.SideDrawerOpen} title1={this.state.title}/>
      <main className="admin-main">
          <div>
            <Switch>
          <Route exact path="/admin/dashboard" render={()=><CompetitionList onchangeLocation={this.changeLocation}/>}/>
          <Route path="/admin/competitionDetails/:comp_id" component={CompetitionDetails} />
          <Route exact path="/admin/studentlist" render={()=><StudentList onchangeLocation={this.changeLocation}/>}/>
          <Route exact path="/admin/profile" render={()=><Profile onchangeLocation={this.changeLocation}/>}/>
          <Route exact path="/admin/judgelist" render={()=><JudgeList onchangeLocation={this.changeLocation}/>}/>
          <Route exact path="/admin/adminlist" render={()=><AdminList onchangeLocation={this.changeLocation}/>}/>
          <Route exact path="/admin/addcompetition" render={()=><AddCompetition onchangeLocation={this.changeLocation}/>} />
          <Route path="/admin/addcompetition/:comp_id" component={AddCompetition} />
          <Route exact path="/admin/addsurvey" render={()=><Survey onchangeLocation={this.changeLocation}/>} />
         </Switch>
          </div>
      </main>
      </BrowserRouter>

{background}
}/>
}/>
}/>
}/>
}/>
} />
} />

是否尝试使用NestedRouter？ 如需了解更多信息，请遵循以下步骤

---

让我知道它是否有效…

您使用的路由器版本主要路由器应该有/admin，然后管理路由应该有/admin/dashboard，/admin/profile，所以我使用的是“react router dom”：“^5.1.2”我尝试了您的建议，但仪表板组件也停止工作