鍍金池/ 問答/HTML5  HTML/ 想問下 react-router v4 的用法

想問下 react-router v4 的用法

我現(xiàn)在正在學習 react,有些地方不知道怎么做才好。
項目進來時,會先請求后臺判斷是否有權限,用 redux 去存儲狀態(tài)值。

export const AuthRoute = ({ component: Component, redirect, loginStatus, ...data }) => (
  <Route {...data} render={props => (
    loginStatus ? (<Component {...props} />) : (
      <Redirect to={redirect || {
        pathname: '/home'
      }} />
    )
  )} />
)

用 loginStatus 去判斷是否有權限。

<Switch>
        <AuthRoute path='/' exact component={IndexPage} loginStatus={loginStatus} />
        <AuthRoute path='/home' exact component={HomePage} loginStatus={!loginStatus} redirect={{ pathname: '/' }} />
</Switch>

當去一個 news 的頁面,需要有權限才能顯示。所以在請求接口時(loginStatus 還沒改改變時),就會重定向到 /home 頁面。當請求完畢,更新了 redux ,變成有權限。

/home 頁面有權限的就話就會重定向到 / 頁面。

期望

權限變更后(有權限)應該跳回去剛進來時的頁面(/news)。

現(xiàn)在

權限變更后,只會跳去定義好的重定向頁面(/)。

那我是不是要拿到因沒權限而重定向前的路徑,當有權限后,就應該重定向回那個路徑呢?

有沒有什么好的解決方法。。。我在 github 找 demo 也找不到好的處理方法。

回答
編輯回答
影魅
當去一個 news 的頁面,需要有權限才能顯示。所以在請求接口時(loginStatus 還沒改改變時),就會重定向到 /home 頁面。當請求完畢,更新了 redux ,變成有權限。

這種操作是有問題的,你不應該在沒判定到有無權限之前跳轉頁面,而是應該在判斷到?jīng)]權限時跳轉到登錄頁面。

簡單來說,所有頁面用戶都可以先進去,但是如果沒有權限,就趕回登錄頁。

2017年11月30日 05:08
編輯回答
傲寒

換個思路試試,你這思維方式是一個使用者的思考方式。
首先:前端拿到的數(shù)據(jù)都應該是有權限的。只要接口返回的數(shù)據(jù),前端全部認為是有權限的,否則權限控制毫無意義。
第二:當用戶登錄時,就應該把該用戶所能訪問的菜單,也就是router的內(nèi)容給你。
第三:在router的最后一個Router中,加入一個404或者403的page,當請求找不到router時,直接進入這個頁面。也就認為是無權限。

2018年4月8日 23:34