react 优化(用于自己记录)

reducer拆分在对应的组件的文件下创建store文件把主store的reducer.js 做变动import { combineReducers } from’redux’;import headerReducer from ‘../common/header/store/reducer’;const reducer = combineReducers({ header:headerReducer});export default reducer;组件对应获取store的变更const mapStateToProps = (state) => { return { focuse:state.header.focuse, list:state.header.list }};组件 store做一个公共的出口文件 index.js//组件下的store文件下的index.jsimport reducer from ‘./reducer’;import * as actionCreators from ‘./actionCreators’;import * as actionTypes from ‘./actionTypes’export { reducer , actionCreators , actionTypes} ;//项目主store文件下的reducer.jsimport { combineReducers } from’redux’;import { reducer as headerReducer } from ‘../common/header/store’;//as 取别名const reducer = combineReducers({ header:headerReducer});export default reducer;//组件文件中做修改import { actionCreators } from ‘./store’const mapStateToProps = (state) => { return { focuse:state.header.focuse, list:state.header.list }};const mapDispatchToProps = (dispatch) => { return { changeFocuse () { store.dispatch(actionCreators.changeFocuse()) }, changeBlue () { store.dispatch(actionCreators.changeBlur()) } }}reducer不能直接修改store中的state，解决办法引入imutable.js