React Router: Nie można odczytać właściwości 'pathname' undefined

Question

Właśnie zacząłem uczyć się React i utknąłem na tym błędzie.

Uncaught TypeError: Cannot read property 'pathname' of undefined at new Router

Oto mój kod:

var React = require('react'); 
var ReactDOM = require('react-dom'); 
var { Route, Router, IndexRoute } = require('react-router'); 
var hashHistory = require('react-router-redux') 

var Main = require('./components/Main'); 

ReactDOM.render(
    <Router history={hashHistory}> 
     <Route path="/" component={Main}> 

     </Route> 
    </Router>, 
    document.getElementById('app') 
); 

Tutorial byłem następujących zastosowań React-Router 2.0.0, ale na moim komputerze używam 4.1.1. Próbowałem wyszukiwać zmiany, ale nie udało mi się znaleźć rozwiązania, które działałoby.

"dependencies": { 
"express": "^4.15.2", 
"react": "^15.5.4", 
"react-dom": "^15.5.4", 
"react-router": "^4.1.1", 
"react-router-dom": "^4.1.1", 
"react-router-redux": "^4.0.8" 

Answer 1

Błąd jest taki, że api w React Router v4 jest zupełnie inny. Można spróbować to:

import React from 'react'; 
import ReactDOM from 'react-dom'; 
import { 
    BrowserRouter as Router, 
    Route 
} from 'react-router-dom'; 

const Main =() => <h1>Hello world</h1>; 

ReactDOM.render(
    <Router> 
    <Route path='/' component={Main} /> 
    </Router>, 
    document.getElementById('app') 
); 

Można przeglądać documentation aby dowiedzieć się, jak to działa teraz.

Here Mam repozytorium z animacją routingu.

I here można znaleźć na żywo demo.

Answer 2

Miałem ten sam błąd i postanowiłem go aktualizującego history z 2.x.x do 4.x.x

npm install history@latest --save