频道栏目
首页 > 程序开发 > web前端 > HTML/CSS > 正文
react-router与react-reduct配合使用时页面不刷新问题解决方法
2017-09-27 11:17:00         来源:ISaiSai的专栏  
收藏   我要投稿

异常现象点击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') )

点击复制链接 与好友分享!回本站首页
相关TAG标签 react-router 代码
上一篇:Math对象、Date对象有什么用途?
下一篇:ECMAScript语法之数组的学习
相关文章
图文推荐
文章
推荐
点击排行

关于我们 | 联系我们 | 广告服务 | 投资合作 | 版权申明 | 在线帮助 | 网站地图 | 作品发布 | Vip技术培训 | 举报中心

版权所有: 红黑联盟--致力于做实用的IT技术学习网站