我的组件脚本是:
export default {
name: "Authenticate",
data: () => {
return {
validationFailed: {}
};
},
methods: {
validateForm() {
this.validationFailed = {};
if (this.createEmail.trim().length === 0) {
this.validationFailed.createEmailField = "Email cannot be blank. ";
}
if (this.createPassword.trim().length === 0) {
this.validationFailed.createPasswordField =
"Password cannot be blank. ";
}
if (Object.keys(this.validationFailed).length === 0) {
return true;
}
return false;
},
handleSubmit() {
const that = this;
axios
.request({
url: `${process.env.VUE_APP_API_URL}/users`,
method: "POST",
data: {
email: this.createEmail,
password: this.createPassword
}
})
.then(response => {
console.log(response);
})
.catch(err => {
that.validationFailed.createEmailField = "something";
});
}
}
};
但是在 catch 中,使用调试器
,我可以看到该值已设置。但在我的 template
中,validationFailed
没有更新。我做错了什么?
最佳答案
这是 Vue react 性问题。您需要将 this.validationFailed
分配给新对象。您可以在catch block 中尝试ES6语法:
that.validationFailed = {
...that.validationFailed,
createEmailField: 'something'
}
关于javascript - 如何使用 vue.js 从 Promise 内的方法更新数据值?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56971583/