在反應路由器是onEnter是onLeave

在反應路由器documentation爲onEnter鉤他們指定如何處理，但onLeave沒有例子。我的問題是如何確認用戶想要正確離開頁面。在反應路由器是onEnter是onLeave

根據以下兩種情況給出的代碼，無論用戶點擊cancel還是ok，它都會離開頁面。但OnEnter鉤按邏輯工作正常。

const checkEnterAbout = (nextState, replace, callback) => { 
    if(!confirm('do you want to enter really!!!')){ 
     replace(`/`); 
    }else{ 
     callback(); 
    } 

} 

const checkLeaveAbout = (prevState) => { 
    console.log(prevState); 
    return confirm("Are you sure you want to leave this page"); 
} 

<Route path="/about" component={About} onEnter={checkEnterAbout} onLeave={checkLeaveAbout} />

另外當我試着withRouter確認指南。它給我的

Failed prop type: Invalid prop `component` supplied to `Route`. 
    in Route

來源

2017-02-15 owaishanif786

您是否想在** **的任何頁面的用戶離開的確認？或者只是關於頁面？ – samvv

只是關於頁面 – owaishanif786

錯誤有一個叫routerWillLeave鉤，這裏有一個例子：

https://github.com/ReactTraining/react-router/blob/master/docs/guides/ConfirmingNavigation.md

來源

2017-02-15 13:14:57 Jayce444

我已經嘗試，但沒有運氣檢查編輯答案 – owaishanif786

後更改導出默認與路由器（約）爲module.exports = withRouter（關於）;這是工作。想知道爲什麼onLeave和onEnter api界面不一樣。一個是通過componentDidMount工作，另一個是通過使用onEnter！ – owaishanif786

在反應路由器是onEnter是onLeave

回答

相關問題