Reactive Router 4.0.0 Router History

Question

The react-router 4.0.0definition of history seems to have changed with the followingindex.js

import React from 'react';
import ReactDOM from 'react-dom';
import { Router, Route, hashHistory } from 'react-router';
import App from './components/App';
import './index.css';

ReactDOM.render(
  <Router history={hashHistory}>
    <Route path="/" component={App} />
  </Router>, document.getElementById('root')
);

I get:

Warning: Failed prop type: The prop `history` is marked as required in `Router`, but its value is `undefined`.

and error after that. I looked through the code but cannot find any example or API how this has changed.

Answer 1

React Router v4 made a difference. They made the individual elements of a top-level router. Replace <Router history={hashHistory}>with <HashRouter>in your code.

Hope this helps.

import {HashRouter,Route} from 'react-router-dom';

<HashRouter>
    <Route path = "/getapp" component = {MainApp} />
</HashRouter>

Answer 2

hashHistoryis no longer an exported object react-router. If you want to use the chronological history, you can simply display <HashRouter>.

import { HashRouter } from 'react-router-dom'

ReactDOM.render((
  <HashRouter>
    <App />
  </HashRouter>
), holder)

Answer 3

, RR ... , BrowserRouter, history.

, Link.

, , . , , Router . , URL .

Answer 4

You can try the code below:

import { Router } from 'react-router'
import createBrowserHistory from 'history/createBrowserHistory'

const history = createBrowserHistory()

<Router history={history}>
  <App/>
</Router>

Check the doc here.