React-router TypeError: _this.props.history tidak terdefinisi
Saya menggunakan react-router dengan react js dan saya mengikuti dokumentasi mereka tetapi menghadapi kesalahan ini
saat mengkompilasi itu menunjukkan kesalahan,
TypeError: _this.props.history is undefined
ini adalah file index.js saya
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import './index.css';
import { Router, Route, browserHistory, IndexRoute } from 'react-router';
ReactDOM.render(
<Router history={browserHistory}>
<Route path="/" component={App}>
</Route>
</Router>
,
document.getElementById('root')
);
dan ini adalah berkas App.js saya
import React, { Component } from 'react';
import './App.css';
class App extends Component {
constructor(props){
super(props);
this.state = {
headerText: "Props from Header.",
contentText: "Props from content."
};
}
render() {
return (
<div className="App">
<ul>
<li><a href="">Home</a></li>
<li><a href="">Home</a></li>
<li><a href="">Home</a></li>
</ul>
</div>
);
}
}
export default App;
16
3
Hal ini karena ada perubahan pada React Router mulai dari 4.0.0. Anda sekarang harus menggunakan
BrowserRouter
dari paketreact-router-dom
ketika Anda menggunakanbrowserHistory
. Jadi kode Anda akan terlihat seperti:Tentu saja, Anda harus menginstal
react-router-dom
terlebih dahulu.Perhatikan juga bahwa jika Anda menggunakan lebih dari satu elemen
Route
, Anda harus menggunakanSwitch
seperti yang dijelaskan dalam jawaban ini.Apakah Anda menggunakan npm? Saya memiliki masalah yang sama dengan "react-router": "^4.0.0" di package.json saya. Mengubahnya menjadi "react-router": "^3.0.2" menyelesaikan masalah saya.
Solusi di bawah ini bekerja untuk saya di ReactDOM.render:
Ini menggunakan beberapa Routing.