In App.js
<Switch>
<Route path="/signin" component={SignIn} />
<Route path="/signout" component={SignOut} />
<Route path="/" component={Dashboard} />
<Redirect to="/" />
</Switch>
In Dashboard.js
<Switch>
<Route path='/students' component={ManageStudents} />
<Route path='/lecturers' component={ManageLecturers} />
<Route path='/surveys' component={ManageSurveys} />
</Switch>
In ManageStudents.js
<Switch>
<Route path='/students/upload' component={UploadFileArea}/>
</Switch>
I can access /signout in Dashboard but in ManageStudents when I click signout the url is http://localhost:3000/students/signout but i doesn't render Signout component. Add <Route path="/students/signout" component={SignOut} />
and it can render.
Can anyone explain why does it happen and solution without adding an additional route?