时间戳

首页 > 解决方案 > how can fix refresh problem in react router

reactjs - how can fix refresh problem in react router

问题描述

i have a strange problem in my react application , i have two phase in my app , first is normal users that is web page and the other is dashboard for admins . in my dashboard when i refresh the page where ever i been the page redirects to /dashboard , for example i'm in /dashboard/cartable/requests then i refresh the page and page go to /dashboard page. my codes is in below : my 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} />
...

in my 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} />
...

in my 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} />
...

标签： reactjsreact-router

解决方案

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

推荐阅读