所以在这里我使用了两个嵌套的浏览器路由器,当我尝试使用链接加载它时它可以工作,但是当我尝试刷新页面时,所有内容都消失了,我无法在屏幕上看到任何东西。
这是我的主路由器,我的子路由器在 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>