在路由器中，道具历史被标记为需要的，但是它的值是未定义的

Question

我是新手。这是我的代码：

var React = require('react');
var ReactDOM = require('react-dom');
var {Route, Router, IndexRoute, hashHistory} = require('react-router');
var Main = require('Main');
ReactDOM.render(
  <Router history={hashHistory}>
  <Route path="/" component={Main}></Route>
</Router>, document.getElementById('app'));

React Router failed prop“history”未定义

当值未定义时，我如何解决历史记录被标记为必需？

升级React路由器并用browserHistory替换hashHistory

在网上进行了很多搜索，但我无法解决这个问题。反应路由器是版本4

Answer 1

如果你想有多条路线，你可以像这样使用交换机，

import {Switch} from 'react-router'; 

然后呢

<BrowserRouter>
     <Switch>
         <Route exact path="/" component={TodoComponent} />
         <Route path="/about" component={About} />
     </Switch>
</BrowserRouter>

Answer 2

您使用的是哪个版本的React路由器？路由器版本4从传入browserHistory类更改为传入browserHistory实例，请参见新文档中的代码示例。

这吸引了很多自动升级的人；“现在任何一天”都会发布迁移文档。

您要将其添加到顶部：

import { createBrowserHistory } from 'history'

const newHistory = createBrowserHistory();

和

<Router history={newHistory}/>

Answer 3

如果您使用的是react-router v4，您还需要安装react-router-dom。之后，从react-router-dom导入Browser路由器，并切换浏览器路由器的路由器。v4似乎改变了一些事情。此外，反应路由器留档是过时的。这是我的工作代码：

import React from 'react';
import ReactDOM from 'react-dom';
import { BrowserRouter, Route } from 'react-router-dom'
import App from './components/App';

ReactDOM.render((
     <BrowserRouter>
          <Route path="/" component={App}/>
     </BrowserRouter>
     ),
     document.getElementById('root')
);

来源