Question

我正在学习react-router v4，我尝试创建一个简单的应用程序。我使用create-react-app cli创建了一个React应用程序。我的routes.js文件：

import React from 'react';
import {BrowserRouter as Router, Route, Switch} from 'react-router-dom';

import Home from '../components/Home';
import ContentOne  from '../components/ContentOne';
import ContentTwo  from '../components/ContentTwo';

const routeConfig = [
  { path: '/',
    exact: true,
    component: Home
  },
  { path:'/home',
    component:Home
  },
  { path: '/contentOne',
    component: ContentOne
  },
  { path: '/contentTwo',
    component: ContentTwo
  }
]

const Routes = () => {
   return (
      <Router>
      <Switch>
       {routeConfig.map((route, index) => {
           <Route path = {route.path} component = {route.component} exact = {route.exact} />
       })}
       </Switch>
      </Router>
   );
}
export default Routes;

App.js档案：

import React, {Component} from 'react';

import './App.css';
import SideNav from './components/SideNav';

class App extends Component {
  render() {
    return (
      <div>
      <SideNav /> 
      <div>
          {this.props.children}
        </div>
      </div>
    );
  }
}

export default App;

Index.js档案：

import React from 'react';
import ReactDOM from 'react-dom';

import Routes from './routes/Routes.js';
import App from './App';
import registerServiceWorker from './registerServiceWorker';
import './index.css';

ReactDOM.render(
<App>
<Routes />
</App>, document.getElementById('root'));
registerServiceWorker();

当我尝试运行应用程序时，我收到一条错误，指出“无法读取未定义的属性'历史记录”。我试过调试，但我无法弄清问题到底在哪里。有谁能告诉我哪里出错了？

我在控制台中出现以下错误：

上下文router在Link标记为必需，但其值为undefined。

Answer 1

尝试在BrowserRouter =＆gt;中添加{history}
import {BrowserRouter as Router, Route, Switch, history} from 'react-router-dom';

无法读取未定义的属性“历史记录”

1 个答案: