Sunday, May 19, 2024
 Popular · Latest · Hot · Upcoming
147
rated 0 times [  152] [ 5]  / answers: 1 / hits: 41372  / 7 Years ago, sat, april 1, 2017, 12:00:00

I try to use react-router-dom 4.0.0 library. But it send me this error




Uncaught TypeError: Cannot read property 'location' of undefined




It seems that problem in browserHistore. Before I used react-router 2.x.x and everything was alright.
This is my index.js



import 'babel-polyfill'
import React from 'react'
import { Router, hashHistory } from 'react-router-dom'
import { render } from 'react-dom'
import { Provider } from 'react-redux'
import { configureStore } from './store'
import { routes } from './routes'

const store = configureStore()

render(
<Provider store={store}>
<Router history={hashHistory} routes={routes} />
</Provider>,
document.getElementById('root')
)


This is my routes



import React from 'react'
import { IndexRoute, Route } from 'react-router-dom'
import App from './containers/App'
import Main from './containers/Main'
import First from './containers/First'

export const routes = (
<Route path='/' component={Main}>
<Route path='/path' component={First} />
<IndexRoute component={App} />
</Route>
)


And also for server side express I set this get configuration



app.get('*', function root(req, res) {
res.sendFile(__dirname + '/index.html');
});

More From » reactjs

 Answers
29

React Router v4 is a complete re-write and isn't compatible with previous versions as you're assuming in your code. With that said, you shouldn't expect to be able to just upgrade to a new major version (V4) and have your app work as normal. You should check out the documentation or downgrade back to V2/3. Here's some code that should get you started in the right direction



import 'babel-polyfill'
import React from 'react'
import { BrowserRouter as Router, Route } from 'react-router-dom'
import { render } from 'react-dom'
import { Provider } from 'react-redux'
import { configureStore } from './store'
import App from './containers/App'
import Main from './containers/Main'
import First from './containers/First'

const store = configureStore()

render(
<Provider store={store}>
<Router>
<Route path='/' component={Main} />
<Route path='/path' component={First} />
</Router>
</Provider>,
document.getElementById('root')
)

[#58308] Thursday, March 30, 2017, 7 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
annaw

Total Points: 18
Total Questions: 91
Total Answers: 98

Location: Guam
Member since Fri, Jun 18, 2021
3 Years ago
;