React路由器無法獲取/取決於onEnter功能

我是React的新手，希望有人能夠闡明爲什麼會發生這種情況以及如何進行調試。React路由器無法獲取/取決於onEnter功能

我有以下途徑定義：

export default (withHistory, onUpdate) => { 
    const history = withHistory? 
       (Modernizr.history ? 
       new BrowserHistory 
       : new HashHistory) 
      : null; 
    return (
    <Router history={history}> 
     <Route path='/login' component={Login} /> 
     <Route path='/' component={Home} onEnter={requireAuth} /> 
    </Router> 
); 
};

requireAuth應該檢查用戶登錄，如果不將其重定向到登錄頁面：

function requireAuth(nextState, transition) { 
    transition.to("/login"); 
}

如果我離開transtion.to調用並瀏覽到根URL我只看到一條消息，在調試器中沒有錯誤消息說「無法獲取/」。在該行上放置斷點似乎沒有任何作用。

特別奇怪的是，如果我用debugger;語句替換transition.to(...)，那麼調用該方法並且路由工作得很好。

我必須對某件事產生誤解，對於這是什麼想法？

編輯：我應該補充說，導航到host:port/login工作正常，所以我知道login路線的作品。

來源

2016-02-08 shieldstroy

什麼版本的react-router？ 1.x的？ – walkerrandophsmith

我使用的是react-router版本1.0.0-beta3。我確實嘗試升級我使用的版本，但我最終以更簡單的方式解決了這個問題。 – shieldstroy

來自Angular背景我錯誤地認爲路由發生在整個客戶端。可以在客戶端和服務器端路由中使用react-router。

transition.to調用在客戶端正常工作，但在服務器端路由踢入並返回Cannot GET /頁面時拋出異常。異常被捕獲但沒有記錄。

我添加了一個if語句，看看我們在客戶端上運行：

if(window.location) { 
    if(!loggedIn) { 
     transition.to("/login"); 
    } 
}

有可能是一個更好的方式來處理這個問題，如果我明白這一點，最終我會更新我的答案。

來源

2016-02-18 01:21:55 shieldstroy

根據目前的文檔，onEnter鉤子接收replace函數作爲其第二參數。即

type EnterHook = (nextState: RouterState, replace: RedirectFunction, callback?: Function) => any;

你是否使用了不同版本的react-router？我試圖通過onEnter掛鉤的替代版本文檔來查找，該掛鉤以transition對象作爲其第二個參數，但我找不到任何運氣。

來源

2016-02-15 00:25:20 UnicodeSnowman

我正在使用react-router版本1.0.0-beta3，它通過Transition對象而不是替換函數。我確實嘗試升級我使用的版本，但我最終以更簡單的方式解決了這個問題。 – shieldstroy

React路由器無法獲取/取決於onEnter功能

回答

相關問題