vuex - Actions的基本使用

Actions类似于Mutations，但是是用来代替Mutations里面的异步操作的。Mutations里面不能做异步操作，例如：网络请求、定时器等。

例子：点击按钮3秒后改变对象中的值

1. 在mutations中改变对象中的年龄

mutations: {
    // 改变info中的值
    infoChange(state) {
      state.info.age = 10
    }
  },

2. 在actions中进行异步操作 - 定时器

actions: {
    // context：上下文
    infoChange(context) {
      setTimeout(() => {
        context.commit('infoChange');
      }，3000)
    }
  }

3. 在App.vue中应用

methods: {
    infoChange() {
      this.$store.dispatch("infoChange");
    }
  }

actions中也可以传递参数

actions: {
    infoChange(context, payload) {
      setTimeout(() => {
        context.commit('infoChange');
        console.log(payload);
      }, 3000)
    }
  },

infoChange() {
      this.$store.dispatch("infoChange", "我是payload");
    }