Vue中Vuex的五个属性和基本用法

884 阅读1分钟

Vue中Vuex的五个属性和基本用法

一、Vuex的五个核心概念:state、getters、mutations、actions、modules

  1. state: vuex的基本数据,用来存储变量,定义我们所需要管理的数组、对象、字符串等等;

  2. getters: 从基本数据(state)派生的数据,相当于state的计算属性,getter 会接收 state 作为第一个参数,而且 getter 的返回值会根据它的依赖被缓存起来,只有 getter 中的依赖值(state 中的某个需要派生状态的值)发生改变的时候才会被重新计算;

  3. mutations: 提交更新数据的方法,必须是同步的(如果需要异步使用action)。每个mution 都有一个字符串的事件类型(type)和一个回调函数(handler),state作为第一个参数,提交载荷作为第二个参数,执行回调函数方法:store.commit; 4.actions: 可以提交 mutation,在 action 中可以执行 store.commit,而且 action 中可以有任何的异步操作。在页面中如果我们要用这个 action,则需要执行 store.dispatch;

5.modules: 模块化vuex,可以让每一个模块拥有自己的 state、mutation、action、 getters,使得结构非常清晰,方便管理。

二、Vuex的用法:

新建vue项目testAPP —> 在testApp中建store文件 —> store文件下又有mudoules 文件夹和 getter.js 和 index.js —> mudoules 文件下建立user.js。