Question

我的react应用程序中有一个奇怪的问题，我的应用程序中有两个阶段，第一个阶段是普通用户，即网页，第二个阶段是管理员的仪表板。在我的仪表板中，当我刷新页面时，无论我将页面重定向到/ dashboard，例如，我在/ dashboard / cartable / requests中，然后刷新页面，然后转到/ dashboard页面。我的代码在下面：我的app.js：

...
<Route exact path='/dashboard/' component={Index} />
            <Route path='/dashboard/login' component={Index} />
            <Route path='/dashboard/cartable' component={Index} />
            <Route path='/dashboard/cartable/requests' component={Index} />
            <Route path='/dashboard/cartable/approved' component={Index} />
            <Route path='/dashboard/cartable/rejected' component={Index} />
            <Route path='/dashboard/elections-management' component={Index} />
            <Route path='/dashboard/statistics' component={Index} />
            <Route path='/dashboard/statistics/assignee' component={Index} />
            <Route path='/dashboard/statistics/participation' component={Index} />
            <Route path='/dashboard/statistics/candidate-report' component={Index} />
            <Route path='/dashboard/change-pass' component={Index} />
            <Route path='/dashboard/errors' component={Index} />
...

在我的index.js中：

...
<Route exact path='/dashboard/' component={Layout} />
            <Route exact path='/dashboard/cartable' component={Layout} />
            <Route path='/dashboard/cartable/requests' component={Layout} />
            <Route path='/dashboard/cartable/approved' component={Layout} />
            <Route path='/dashboard/cartable/rejected' component={Layout} />
            <Route path='/dashboard/elections-management' component={Layout} />
            <Route exact path='/dashboard/statistics' component={Layout} />
            <Route path='/dashboard/statistics/assignee' component={Layout} />
            <Route path='/dashboard/statistics/participation' component={Layout} />
            <Route path='/dashboard/statistics/candidate-report' component={Layout} />
            <Route path='/dashboard/change-pass' component={Layout} />
            <Route path='/dashboard/errors' component={Layout} />
...

在我的layout.js中：

...
<Route exact path='/dashboard' component={Requests} />
                                <Route exact path='/dashboard/cartable' component={Requests} />
                                <Route path='/dashboard/cartable/requests' component={Requests} />
                                <Route path='/dashboard/cartable/approved' component={Approved} />
                                <Route path='/dashboard/cartable/rejected' component={Rejected} />
                                <Route path='/dashboard/elections-management' component={ElectionManagement} />
                                <Route exact path='/dashboard/statistics' component={Participation} />
                                <Route path='/dashboard/statistics/assignee' component={Assignee} />
                                <Route path='/dashboard/statistics/participation' component={Participation} />
                                <Route path='/dashboard/statistics/candidate-report' component={CandidateReport} />
                                <Route path='/dashboard/change-pass' component={ChangePassword} />
                                <Route path='/dashboard/errors' component={Errors} />
...

Answer 1

我相信，如果您将“ / dashboard”路线移至列表末尾，该问题可能会得到解决

Answer 2

像这样通过Switch包装您的路线

<Switch>
   <Route
   ...

</Switch>

如何解决React路由器中的刷新问题

2 个答案: