这是索引js文件。
import React from "react";
import { render } from "react-dom";
import {Router, Route, browserHistory} from "react-router";
import {EmployeeList} from "./employeeList";
import {EditForm} from "./edit";
class App extends React. Component{
render(){
return (
<Router history={browserHistory}>
<Route path={"/"} component={EmployeeList} />
</Router>
);
}
}
render(<App />, window.document.getElementById("app"));
这是employeeList js文件。
import React from "react";
export class EmployeeList extends React. Component {
constructor(props) {
super(props);
};
render() {
return (
<div>
<h2>Basic Table</h2>
<table class="table table-dark table-striped">
<thead>
<tr>
<th>Id</th>
<th>First Name</th>
<th>Last Name</th>
<th>Button</th>
</tr>
</thead>
{student}
</table>
</div>
);
}
}
主页面是index.js,从那个页面我想要调用employeeList页面..但它显示未定义的位置类型error.install npm react-route仍然无法正常工作..无法找出错误。
答案 0 :(得分:0)
您应该使用BrowserRouter
中的'react-router-dom'
而不是Router
。
在处理自定义历史记录时,将使用路由器组件,因此需要history
道具。要在Web浏览器上使用react-router,您应该使用react-router-dom
中的BrowserRouter。为清楚起见,这里是Router docs和BrowserRouter docs
你的代码应该是:
import { BrowserRouter } from 'react-router-dom';
...
class App extends React. Component{
render(){
return (
<BrowserRouter>
<Route path={"/"} component={EmployeeList} />
</BrowserRouter>
);
}
}