核心提示:异常现象点击Link url 变化但是页面不更新出现此问题的条件:1.使用了react-reduct 的connect2.Router与Root 之间有 有layout布局 元素解决办法:withRo...
异常现象点击Link url 变化但是页面不更新
出现此问题的条件:
1.使用了react-reduct 的connect
2.Router与Root 之间有 有layout布局 元素
解决办法:withRouter 包裹组件
原因:react-reduct shouldComponentUpdate 没有接收到任何属性改变,因此不再重新绘制页面
var Home = withRouter (connect()(() =>
Home 点击到子页面 )) var Cal = withRouter( connect()(() =>
Cal
回到首页)) var Layout =withRouter ( connect()((props) =>
头{props.children}尾
))
异常代码如下
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()(() =>
Home 点击到子页面 ) var Cal = connect()(() =>
Cal
回到首页) var Layout = connect()((props) =>
头{props.children}尾
) ReactDOM.render(
, document.getElementById('root') )