community/vuejs_tutorials/vuex_tutorial

Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式和库。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。

Vuex 简介

Vuex 是一个专门为 Vue.js 应用程序开发的状态管理模式和库。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。

主要概念

State: 全局应用的状态。
Getters: 从 state 中派生出一些状态。
Mutations: 提交 mutation 是改变 state 的唯一方式。
Actions: 提交 mutation 的封装，可以包含异步操作。
Modules: 将 store 分割成模块。

快速开始

安装 Vuex：

npm install vuex --save

创建一个 Vuex 实例：

import Vue from 'vue';
import Vuex from 'vuex';

Vue.use(Vuex);

const store = new Vuex.Store({
  state: {
    count: 0
  },
  mutations: {
    increment(state) {
      state.count++;
    }
  },
  actions: {
    increment(context) {
      context.commit('increment');
    }
  }
});

在组件中使用：

export default {
  computed: {
    count() {
      return this.$store.state.count;
    }
  },
  methods: {
    increment() {
      this.$store.dispatch('increment');
    }
  }
};

扩展阅读

Vue.js