Vuex状态管理器

Vuex状态管理机制

Vuex是专门为vue.js应用程序开发的状态管理模式,集中式存储管理应用所有组件的共享状态,一般用于较复杂的中大型项目。

  • 学习vue.js开发音乐app中使用到的vuex全家桶,目录如下

Vuex状态管理器_第1张图片

  • 当给vuex定义数据时,通常修改以文件

    1>state (想清楚原始数据是什么,即跟组件,模块,项目相关的一些数据,一般是底层数据)
    Vuex状态管理器_第2张图片
    2>getters (对数据的一些映射,可以是些函数,这些函数类似于计算属性,根据state的不同值计算新的值,)
    ![getters代码如图](https://img-blog.csdnimg.cn/201812201013](https://img-blog.csdnimg.cn/20181220101449568.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODQ4MzEzMw==,size_16,color_FFFFFF,t_70)
    3>mutations-types (定义那些修改的动作,通常定义为字符串常量)
    Vuex状态管理器_第3张图片
    4>mutations (修改数据的逻辑,本质是些函数,函数名是mutation-types中定义的值,通常带两个参数,第一个是state,第二个是要修改的对象,去修改state中的值)
    Vuex状态管理器_第4张图片
    5>actions通常有两种情况下使用(同时修改多个状态的异步操作和对mutations的封装)
    Vuex状态管理器_第5张图片
    顺便感谢HuangYi老师的视频授课,非常好,通俗易懂,初学vue的宝宝很值得看吆

你可能感兴趣的:(Vue,vuex状态管理器)