Javascript 无法读取未定义的属性“位置”
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/43159975/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Cannot read property 'location' of undefined
提问by Tsymbalenko Oleksandr
I try to use react-router-dom 4.0.0 library. But it send me this error
我尝试使用 react-router-dom 4.0.0 库。但它给我发送了这个错误
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
似乎是 browserHistore 中的问题。在我使用 react-router 2.xx 之前，一切都很好。这是我的 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');
});
回答by Tyler McGinnis
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 documentationor downgrade back to V2/3. Here's some code that should get you started in the right direction
React Router v4 是完全重写的，并且与您在代码中假设的先前版本不兼容。话虽如此，您不应该期望能够升级到新的主要版本 (V4) 并让您的应用程序正常工作。您应该查看文档或降级回 V2/3。这里有一些代码可以让你朝着正确的方向开始
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')
)
回答by MERLIN THOMAS
Check the version of react-router-dom in package.json
If its version is greater than 4 then in your file import BrowserRouter :-
import { BrowserRouter as Router, Route } from 'react-router-dom'else if its version is less than 4 then import Router :-
import { Router, Route } from 'react-router-dom'
检查 package.json 中 react-router-dom 的版本
如果它的版本大于 4，则在您的文件中导入 BrowserRouter :-
import { BrowserRouter as Router, Route } from 'react-router-dom'否则，如果它的版本小于 4，则导入路由器：-
import { Router, Route } from 'react-router-dom'
回答by Sodik Abdullaev
on your terminal install, npm i [email protected]and edit ur index.js file like that
在您的终端安装上， npm i [email protected]并像这样编辑您的 index.js 文件
import React from 'react';
import ReactDOM from 'react-dom';
import { Router, Switch, Route} from 'react-router-dom';
import createBrowserHistory from 'history/createBrowserHistory';
import App from './components/App';
import './index.css'
const history = createBrowserHistory();
ReactDOM.render(
<Router history={history}>
<Switch>
<Route path='/' component={App}/>
</Switch>
</Router>,
document.getElementById('root')
);
