vuex之actions

一、在vuex中，actions是用于触发mutations方法的，它一般用于执行异步操作，这样子有利于我们日常开发，例如我们做登录时需要调用登录接口，然后获取到token存起来，用于自动登录，那么我们就可以用到actions来做这个操作了。

const state = {
userName:'',
token:''
},

const mutations = {
SET_USERNAME:(state,userName)=>{
state.userName = userName
};
SET_TOKEN:(state,token)=>{
state.token = token
}
}

const actions = {
login({commit},userInfo){
const {userName,passworld} = userInfo;
return new Pormise((resove,reject)=>{
  login({userName:userName,passworld:passworld}).then(res =>{
  const { data } = res
        commit('SET_TOKEN', data.token)
         commit('SET_USERNAME', data.token)
        resolve()
  }).catch(error=>{
  reject(error)
  })
})
}
}

在页面中调用

this.$store.dipatch('login',this.form).then(res =>{

}).catch(()=>{
})

由此可知要想在页面中调用actions方法，我们需要用到dipatch来触发，意思就是分发，这样子我们就可以把接口的返回数据当作公共的状态处理了，当然我们也不是为了用vuex而用，平常开发中一般不用它也能满足需求的，所以自己看着来吧。你get到了吗