提示:本站收集StackOverFlow近2千万问答，支持中英文搜索，鼠标放在语句上弹窗显示对应的参考中文或英文， 本站还提供 中文繁体 英文版本 中英对照 版本，有任何建议请联系yoyou2525@163.com。
我正在创建一个简单的 React 应用程序，在实现路由时出现以下错误：
类型错误：无法读取反应中未定义的属性“位置”。
应用程序.js：
import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
import Header from "./components/header";
import Home from "./components/Home";
import About from "./components/About";
import Contact from "./components/Contact";
import { Router, Route} from 'react-router'
class App extends Component {
render() {
return (
<div className="App">
<Header />
<Router>
<Route path = "/" component = {App}>
<Route path = "home" component = {Home} />
<Route path = "about" component = {About} />
<Route path = "contact" component = {Contact} />
</Route>
</Router>
<header className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<p>
Edit <code>src/App.js</code> and save to reload.
</p>
<a className="App-link" href="https://reactjs.org"target="_blank" rel="noopener noreferrer">
Learn React
</a>
</header>
</div>
);
}
}
export default App;
我在这里缺少什么？
这里的问题似乎与路由器包的导入有关。
安装： npm install --save react-router-dom
将 App.js 中的包导入为：
import { BrowserRouter, Route } from "react-router-dom";
现在将您的 App.js render()函数修改为-
return (
<BrowserRouter>
<div className="App">
<Header />
<Route exact path = "/" component = {Home} />
<Route path = "about" component = {About} />
<Route path = "contact" component = {Contact} />
<header className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<p>
Edit <code>src/App.js</code> and save to reload.
</p>
<a className="App-link" href="https://reactjs.org"target="_blank" rel="noopener noreferrer">
Learn React
</a>
</header>
</div>
</BrowserRouter>
);
声明：本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.