vuex中action方法调用

在vuex中，Action是用于处理异步操作的方法。Action提交的是mutation而不是直接变更状态。Action可以包含任意异步操作。

Action通过store.dispatch方法触发，其接受一个与mutation相同的参数对象。不同的是，Action提交的是mutation的type，而不是直接变更状态。在Action中可以执行异步操作，然后再提交mutation来变更状态。

Action方法的基本调用如下：

1. 在Vuex store中定义action：

const actions = {
  async getUserInfo(context, payload) {
    // 这里可以进行异步操作
    let res = await api.getUserInfo(payload)
    // 提交mutation来更新state
    context.commit('updateUserInfo', res.data)
  }
}

2. 在Vue组件中使用action：

this.$store.dispatch('getUserInfo', {id: 123}).then(() => {
  // do something
})

在上述示例中，我们在Vuex store中定义了一个名为getUserInfo的action方法，它接受context和payload两个参数。我们可以在这里执行异步操作，例如从服务器获取用户信息。在异步操作完成后，我们通过提交mutation来更新状态。

在Vue组件中，我们可以通过this.$store.dispatch('getUserInfo', {id: 123})来调用action方法。这里我们将{id: 123}作为payload传递给了action。在action中，我们可以通过context.commit来提交mutation来更新状态。最后，我们通过Promise的then方法来处理异步操作完成后的回调函数。