react中使用路由报错
TypeError: Cannot read property 'location' of undefined
报错代码为
// 经过测试是 <Router> 的问题,换成 <HashRouter> 就不报错了
import { Router, Route, Switch, Redirect } from 'react-router-dom'
import Login from './components/login/index'
import Admin from './components/admin/index'
function App() {
return (
<Router>
<Switch>
<Route path="/login" component={Login} />
<Route path="/admin" component={Admin} />
<Redirect from="/" to="/admin" exact />
</Switch>
</Router>
)
}
export default App
正常运行的代码
// <Router> 换成了 <HashRouter> 就不报错了
import { HashRouter, Route, Switch, Redirect } from 'react-router-dom'
import Login from './components/login/index'
import Admin from './components/admin/index'
function App() {
return (
<HashRouter>
<Switch>
<Route path="/login" component={Login} />
<Route path="/admin" component={Admin} />
<Redirect from="/" to="/admin" exact />
</Switch>
</HashRouter>
)
}
export default App
今天碰到这个问题是在新装的react脚手架中安装路由时发生的,安装的路由版本为,
在低版本路由中使用 Router 不报错,可能是版本的问题,具体什么原因目前不清楚,但是可以通过更换为 HashRouter 来解决。
欢迎大家一起讨论报错原因。