react 中 redux 多个状态的拆分合并

2018-10-27  本文已影响0人  MissSixty

因为整个store中只能存放一个状态,但是有时为了团队更好的协作开发,必须拆分若干个组件,这时我们就要想办法把一个状态分成多个小状态,再在store中合并为一个状态。

1.引入

import {combineReducers} from "redux";

2.使用

const reducer = combineReducers({  //将2个小状态合并
    title:titlereducer,  //标题的状态
    list:listreducer  //列表的状态
})

const store = createStore(reducer)  //返回一个大状态

注:因为合并完是一个大对象,所以在store.getState()时应再加上对象里的名字

this.setState({
    title:store.getState().title
})

上述方法就可将各个小组件都分给组员各自开发。最后通过ES6引入和导出方法将若干个小文件组合在一起。
store文件夹下推荐新建一个reducers子文件夹。store中只放index.js文件,其他子文件放到reducers文件夹中,使结构更清晰。

设计和使用的三大原则:
1.state以单一对象存储在store对象中
2.state只读(每次都返回一个新的对象)
3.使用纯函数reducer执行state更新

上一篇下一篇

猜你喜欢

热点阅读