Vuex学习(二) ——vuex过程
一、vuex过程
action 消息模块
state 存储数据
view 组件视图
通信流程:
一个组件发送消息,消息被action模块捕获,并根据消息类型,处理数据,action将新的数据传递给state去存储,state中的数据发生了改变,将新的数据传递给另一个组件
在vuex中,把action分为两类:
一类是同步消息:mutation
为了可测试
一类是异步消息:action
为了异步操作
二、store组成
上图中,绿色虚线部分就是vuex,在代码中用store实现
由于vuex实现的是单一数据源的特征,所以整个应用程序中,有且只有一个store
在store中,由五部分组成:
(1)state:存储组件共享的数据
(2)getters:存储组件间共享的计算属性数据
getter与state的关系与data与computed的关系是一样的
(3)mutations :订阅同步消息的模块
通过commit方法来提交同步消息
(4)action :订阅异步消息模块
通过dispatch方法来提交同步消息
(4)action :订阅异步消息模块
通过dispatch方法来提交同步消息
(5)modules :用来切割模块的
注意:如果没有异步消息就直接触发同步消息