我们如何将数据传递到vuex操作中

Question

我对vuex中的操作不太满意。

我不想在我的登录组件中调用使用axios进行api调用的vuex操作。

但是，由于我的组件而传输的数据在操作中没有接收到。。

我不知道该怎么做。。

this.$store.dispatch('REGISTER', {
username: this.username,
email: this.email,
password: this.password
})
.then((response) => {
console.log(response)
this.$router.push('/login')
})
.catch (() => {
this.error = true;
})

在我的vuex模块中：

import axios from "axios";
export default {
state: {},
mutations: {},
getters: {},
actions: {
REGISTER: ({ username, email, password }) => {
return new Promise((resolve, reject) => {
axios
.post(process.env.VUE_APP_API_URL + "auth/register", {
username: username,
email: email,
password: password
})
.then(({ data, status }) => {
if (status === 201) {
localStorage.setItem('access_token', data.data.token);
resolve(true);
}
})
.catch(error => {
reject(error);
});
});
},
}
};

谢谢

Answer 1

您正在将一个对象传递给vuex操作。尝试修改你的行动方法，这样：

REGISTER: ({ commit }, data) => {
let {username, email, password} = data

编辑：具体来说，任何vuex操作接收的第一个参数都是一个包含提交、状态、getter和分派的上下文对象。第二个参数是通过调用dispatch传递给它的任何对象maiorano84