Reactjs 失败的道具类型：道具'history'在'Router'中标记为必需，但其值为'undefined'`

失败的道具类型：道具

历史记录

在

路由器

中标记为所需，但其值为

未定义

Index.js

从'react dom'导入{render}；
从'react redux'导入{Provider}；
从“react Router”导入{Router，browserHistory}；
从“/store/configureStore.js”导入Sstore；
从“./routes”导入路由；
从'/actions/movieActions.js'导入{loadMovies}；
const store=Sstore；
store.dispatch（loadMovies（））；
渲染（
,
document.getElementById（'app'）
);

Route.js

从“React”导入React；
从“react router”导入{Route，IndexRoute}；
从“./components/Home.js”导入Home；
导出默认值（
);

这是正确的反应路由器redux v4示例。您必须使用react router redux中的

ConnectedRouter

，并传递

历史记录。我昨天根据这个例子配置了我的项目，它工作得很好
 在React router v4中，您的配置应该如下所示

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

 <Provider store={createStoreWithMiddleware(reducers)}>
    <BrowserRouter>
      <div>
        <Switch>
            <Route path="/api/:id" component={ComponentOne} />
            <Route path="/" component={Home} />
        </Switch>
      </div>
    </BrowserRouter>
  </Provider>

从'react router dom'导入{BrowserRouter，Route，Switch}；

自上一版本以来，API已更改。还要注意，顺序很重要。将最具体的路径保留在顶部。
在我的项目中，我通过两个步骤消除了此类错误：

从“历史记录/createBrowserHistory”导入导入createBrowserHistory；并声明const customHistory=createBrowserHistory（）；像这样：

import  { BrowserRouter as StaticRouter, Router, Switch, Route, Link } from 'react-router-dom';
import  createBrowserHistory from 'history/createBrowserHistory';
const   customHistory = createBrowserHistory();


看起来有必要向路由器添加历史记录属性：

<Router history={customHistory}>
<div>
    <Link to={'/.../' + linkName1}>
        {itemName1}
    </Link>
    <Link to={'/.../' + linkName2}>
        {itemName2}
    </Link>
</div>


{itemName1}
{itemName2}


您的代码正在使用react router 2/3的api。在这里查找v4文档，您可以在这里找到您的答案@abdul I want to use with store
import  { BrowserRouter as StaticRouter, Router, Switch, Route, Link } from 'react-router-dom';
import  createBrowserHistory from 'history/createBrowserHistory';
const   customHistory = createBrowserHistory();

<Router history={customHistory}>
<div>
    <Link to={'/.../' + linkName1}>
        {itemName1}
    </Link>
    <Link to={'/.../' + linkName2}>
        {itemName2}
    </Link>
</div>