在具有歷史對象的反應路由器內傳遞道具

import createBrowserHistory from 'history/ 
import appState from './AppState' 

const customHistory = createBrowserHistory() 
ReactDOM.render(
    <Router> 
    <div> 
     <Route path="/submit" component={Submit} history={history}/> 
    </div> 
    </Router>, 
    document.getElementById('root') 
);

注意：如果我像其他屬性一樣添加appState; 提交組件中沒有appState等屬性，在具有歷史對象的反應路由器內傳遞道具

如果我使用這個;

<Route path="/submit" render={routeProps=> <Submit appState={appState}/> history={history}/>

appState傳遞正常，但是這次歷史對象已丟失，這樣做的正確方法是什麼？ appState只是mobx類實例。

編輯：我發現了一個「怪異」的解決方案。我將路線元素更改爲此;

<Route path="/submit" render={routeProps=> <Submit appState={appState}/> history={history}/>

然後我能夠通過this._reactInternalInstance._context.router.history.push('/home') 訪問相同的歷史對象之前，我做了這個變化我能，如果我離開這個把它作爲this.props.history.push('/home')

，因爲它工作正常，但其煩人得到這個歷史以這種方式對象

來源

2017-07-14 TyForHelpDude

你應該將'history'對象傳遞給'router'，而不是'route'。如我錯了請糾正我。 – degr

也許是常見的耶，但在這個示例中，我可以使用它像「this.props.history.pushState（'/ previousPage'）」所以我的問題不覆蓋機智的歷史使用 – TyForHelpDude

檢查此：https：// stackoverflow .com/questions/43469071/react-react-router-dom-pass-props-to-component/43469277＃43469277 –

我認爲這是正確的，最好把你的歷史放在路由器不路由。

看下面的答案，這個對我很好。你仍然可以在這個答案中使用history.push。有時history.push沒有重定向頁面。如果發生這種情況，您可以將location.href = location.href刷新頁面。

https://stackoverflow.com/a/42679052/7765396

來源

2017-07-14 12:58:41

嗨，感謝您的回答，但正如我在評論部分提到的那樣，我的問題沒有得到什麼， – TyForHelpDude

你做錯了，我敢肯定它。瀏覽器歷史記錄是一個單例對象，因此您可以從模塊中導出它。看看這裏：

//history.js: 
import createBrowserHistory from 'history/ 
export default createBrowserHistory(); 

//Submit.js 
import history from "myapp/history" 
export default class Submit extends React.Component { 
    ... 
} 

//MyRouter.js 
import Submit from './myapp/Submit' 
import appState from './AppState' 
ReactDOM.render(
    <Router> 
    <div> 
     <Route path="/submit" component={Submit}/> 
    </div> 
    </Router>, 
    document.getElementById('root') 
);

來源

2017-07-14 14:29:00 degr

是啊我想使用customHistory（createBrowserHistory的實例），這是所有關於這個問題：D – TyForHelpDude

在具有歷史對象的反應路由器內傳遞道具

回答

相關問題