视图、操作、状态之间的关系:
数据单向流动
一个应用可以看作是由上面三部分组成: View, Actions,State,数据的流动从View => Actions => State =>View 以此达到数据的单向流动.
但是项目较大的, 组件嵌套过多的时候, 多组件共享同一个State会在数据传递时出现很多问题.Vuex就是为了解决这些问题而产生的.
Vuex可以被看作项目中所有组件的数据中心,我们将所有组件中共享的State抽离出来,任何组件都可以访问和操作我们的数据中心.
Vuex原理
上图可以很好的说明Vuex的组成,一个实例化的Vuex.Store由state, mutations和actions三个属性组成:
- state中保存着共享数据;
- 修改state中的状态只能提交mutations中的方法,且方法必须是同步的;
- 需要异步方法时,写在actions中, 提交mutations,由mutations修改state状态.