Vuex 状态更新机制

发表于： 更新于：
字数：229 阅读：≈ 1分钟 浏览：

‍

‍

Vuex 状态更新机制

​​

Vuex 的核心概念

  1. State

    数据都存放在 State 中

  2. Getter

    类似 Vue 的计算属性

  3. Mutation

    State 中的属性，只能通过 Mutation 来修改状态，Mutation 中都是同步操作。

    通过 commit 来触发 Mutation。

  4. Action

    和 Mutation 类似，但是可以进行进行异步操作。

    内部依然是使用 Mutation 来更新状态。

    通过 dispatch 来触发 Action

  5. Module

    由于 Vuex 是单一状态树，应用的所有状态会集中到一个对象上。当应用较较复杂时，该对象会变得难以维护，此时可以拆分成多个模块来维护。

Vuex 的基本结构

import Vuex from "vuex"
import Vue from "vue"

Vue.use(Vuex);

// Vuex Store的基本结构
export default new Vuex.Store({
  state: {},
  getters: {},
  mutations: {},
  actions: {},
  modules: {},
});