6
私はReact Router V4にアップグレードしましたが、現在history.pushメソッドで苦労しています。ReactJSルータV4 history.pushが機能しません
私はindex.jsファイルがあります：
import React from "react";
import { render } from "react-dom";
import { BrowserRouter, Route } from 'react-router-dom';
import createBrowserHistory from 'history/createBrowserHistory';
const history = createBrowserHistory();
import { Main} from "./components/Main";
import { About } from "./components/About";
import { Cars} from "./components/Cars";
class App extends React.Component {
render() {
return (
<BrowserRouter history={history}>
<div>
<Route path={"/"} component={Main} />
<Route path={"/cars"} component={Cars}/>
<Route path={"/about"} component={About}/>
</div>
</BrowserRouter>
)
}
}
render(<App/>, window.document.getElementById("app"));
をそして私は、私はこのようになり、特定のページに戻るには、単純なを追加し、別のファイル、持っている：だから
import React from "react";
import createBrowserHistory from 'history/createBrowserHistory';
const history = createBrowserHistory();
export class Cars extends React.Component {
navigateBack() {
history.push('/')
}
render() {
return(
<div>
<h3>Overview of Cars</h3>
<p>Model: </p>
<button onClick={this.navigateBack} className="btn btn-primary">Back</button>
</div>
)
}
}
を私はここで何がうまくいかないのか理解できません。ボタンをクリックすると、URLは/に変わりますが、それだけです。私を助けることができる人がいますか？
EDIT
私はこれを行うときに動作すること、が分かった：
this.props.history.push('/home')
と
<button onClick={this.onNavigateHome.bind(this)}
が、それは何らかの形で間違っているようです？
私は
this.context.history.push('/home')
を行うとき、私はCannot read property 'context' of nullを取得しますが、なぜ？私の<BrowserRouter>セットアップが間違っていますか？
this.context.history.push('/cart');が
チェックアウトこれらの記事を使用する必要がV4で
デフォルトでは、BrowserRouterには暗黙の履歴があります。代わりにルーターを使用する必要があります。 リファレンス：https://reacttraining.com/react-router/web/api/Router – Adriano
[React Router v4の履歴へのプッシュ方法]の複製がありますか（https://stackoverflow.com/questions/42701129/）どのようにしてヒストリー・イン・ヒストリー・イン・リアクション・ルータ-v4） – lux