2021-05-16

关于vuex中的actions的参数问题

在vuex的使用过程中遇到了actions的传参问题，今天来给大家分享一下，actions中定义的方法有一个默认参数，就是与store实例具有相同方法的属性context，该属性包过以下几个方面

context:{
        state,   等同于store.$state，若在模块中则为局部状态
        rootState,   等同于store.$state,只存在模块中
        commit,   等同于store.$commit
        dispatch,   等同于store.$dispatch
        getters   等同于store.$getters
}

所以在我们调用mutations中的方法的时候经常会看到这样写，

  actions: {
    //异步改变state数据
    asyncChange({commit}, payload) {
      console.log(xxx);
      let user = '张三'
      setTimeout(() => {
        user = payload
       commit('changeUserinfo', user)
      }, 1000)
    }
  },

这其实是利用了es6的解构赋值，取到了context中的commit,第二个参数是我们在用dispatch调用actions中的方法的时候传递的参数。