项目随笔2

College

内容框架

mapStatetoProps里返回的数据， 是从CollegeRedux中reducer返回的新的state中获取的


mapStatetoProps(state) {
  return {
    article: state.CollegeReducer.article   //state后面要跟reducer名
    }
}

mapdispatchToProps(dispatch) {
return {
    action: bindActionCreators(actions,dispatch)  //这里面的actions是在College顶部获取的     import { actions } from 'CollegeRedux';
    }
}

路径跳转

如果是内部路径，可以用browserHistory.push('/college/basic');
    如果是外部路径，可以用window.location.href = 'http://www.baidu.com'; 不可以用browserHistory.push

刚加载的时候页面无内容的地方背景为黑色，应该设置全局样式
    .wrapper {
        width: 100%;
        height: 100%;
        position: absolute;    //不设置定位，不起作用
    }

CollegeRedux:

action的定义中请求数据
    function getArticle() {
        return (dispatch) => {
            axios({
            method: 'post',...,onSuccess: (res) => {
                dispatch({
                    type: 'ARTICLE',data: res.list    //根据后台给的接口
                })
            }
        })
        }
    }

输出reducer
    export default function CollegeReducer( state=initState,action ) {
        switch(action.type) {
            case 'ARTICLE': 
                return Object.assign({},state,{ article: action.data });
        }
    }

输出总的 actions
export const actions = {                //注意不是这里用bindActionCreators
    getArticle,...
}

多个页面可以使用同一个CollegeRedux文件，不用重新写一个redux文件

原文地址：https://www.jb51.cc/react/302893.html