在之前的页内应用示例中,我们已经在vue中先体验到了状态管理的魅力。
通过控制组件中的data,我们可以很方便的控制todo列表的显示、删除等操作。在本章中,我们将引入更加复杂的状态管理方案-redux。
redux是一个用于应用的可预测状态容器,它基于flux模式(一种react提出的状态管理思路),如下图所示:
我们把flux分成3层(action、dispatcher、store)外加类react的view层框架,共同构成了一个状态管理方案。
在redux中的3层是action、reducer、store。
我们可以把action看做发起一起事件,通过发起事件,我们可以通知reducer进行某些操作。
reducer是一个中间连接层,用于接收action,并把action转化为对应数据发给store。
store是一个数据容器,用于存储现有的数据,view层调用的数据就是由store来提供。
在理想状况下,数据是单向流动的。view层如果要变更数据,需要通过action提交,发送给reducer,reducer更新store,最后反馈回view层。
由于是单向数据流,我们可以很方便的通过redux提供的chrome插件在项目中按action监控每次数据的变化。
- 查看更多关于redux的内容请参考官方文档。