react-router 与react-reduct 配合使用时，页面不刷新问题

参考文档：https://reacttraining.com/react-router/core/guides/redux-integration/blocked-updates

异常现象点击Link url 变化但是页面不更新
出现此问题的条件：
1.使用了react-reduct 的connect
2.Router与Root 之间有 有layout布局 元素
解决办法：withRouter 包裹组件
原因：react-reduct shouldComponentUpdate 没有接收到任何属性改变，因此不再重新绘制页面

var Home =  withRouter (connect()(() => <Link to={"Cal"}>Home 点击到子页面</Link>))var Cal = withRouter( connect()(() => <div>Cal <Link to={"/Home"}>回到首页</Link></div>))var Layout =withRouter ( connect()((props) => <div>头{props.children}尾</div>))

异常代码如下

import React from 'react'import ReactDOM from 'react-dom'import {createStore} from 'redux'import {Provider, connect} from 'react-redux'import {Route, Switch, Link, BrowserRouter as Router} from 'react-router-dom' ;const store = createStore(    function* (state, action) {        return state    })var Home = connect()(() => <Link to={"Cal"}>Home 点击到子页面</Link>)var Cal = connect()(() => <div>Cal <Link to={"/Home"}>回到首页</Link></div>)var Layout = connect()((props) => <div>头{props.children}尾</div>)ReactDOM.render(    <Provider store={store}>        <Router>            <div>                <Layout>                    <Switch>                        <Route exact path="/Home" component={Home}/>                        <Route path="/Cal" component={Cal}/>                    </Switch>                </Layout>            </div>        </Router>    </Provider>,    document.getElementById('root'))