Question

我很难弄清Promises的行为。我正在使用Vue和vee-validate库，该库允许通过以下方式手动验证表单：

this.$validator.validate()

但是，当我尝试使用它时，我会感到奇怪：

async isFormValid() {
    return await this.$validator.validate();
},

每当我提交有错误的表单时，该表单就会发送AJAX请求：

onApprove() {
    if (!that.isFormValid) {
        return false;
    }
    $.ajax({
        ...         
    });
    return false; // Modal never closes unless AJAX is successful.
},

此外，我尝试了以下构造：

onApprove() {
    this.$validator.validate().then(result => {
        if(result) {
            $.ajax({
                ...        
            });
        }
        return false; // Modal never closes unless AJAX is successful.
     });
},

但这也不起作用。通过执行此操作，我找到了一种解决方法：

isFormValid() {
    this.$validator.validate();
    return Object.keys(this.fields).every(key => this.fields[key].valid);
},

但是，如果有人可以解释我对“承诺”的误解，那将是很好的。

修改

完整的批准示例（无论验证如何，始终返回true：

onApprove() {
    that.$validator.validate().then(result => {
        if (result) {
            $.ajax({
                url: '/settings/user_management_add_user', method: 'POST', data: {
                    csrfmiddlewaretoken: that.csrfToken, password: that.password, user: JSON.stringify(that.users[that.activeUserRow]),
                }, success() {
                    $('#modify_user_modal').modal('hide');
                    that.showToast('check icon', gettext('User created'));
                    that.activeUserRow = undefined;
                    that.initialQuery();
                }, error(data) {
                    that.showToast('remove icon', gettext('User could not be created'));
                    if (data.responseText && data.responseText.length < 20) {
                        that.showToast('remove icon', data.responseText);
                    }
                },
            });
        }
        return false; // Modal never closes unless AJAX is successful.
    });
},

此方法也不起作用（首先返回false）：

onApprove() {
    that.$validator.validate().then(result => {
        if (!result) {
            return false
        }
            $.ajax({
                url: '/settings/user_management_add_user', method: 'POST', data: {
                    csrfmiddlewaretoken: that.csrfToken, password: that.password, user: JSON.stringify(that.users[that.activeUserRow]),
                }, success() {
                    $('#modify_user_modal').modal('hide');
                    that.showToast('check icon', gettext('User created'));
                    that.activeUserRow = undefined;
                    that.initialQuery();
                }, error(data) {
                    that.showToast('remove icon', gettext('User could not be created'));
                    if (data.responseText && data.responseText.length < 20) {
                        that.showToast('remove icon', data.responseText);
                    }
                },
            });
        return false; // Modal never closes unless AJAX is successful.
    });
},

Answer 1

因此@Axnyff找到了this语义ui beug报告，这使我找到了解决方案：

onApprove() {
    that.$validator.validate().then((result) => {
        if (result) {
            $.ajax({
                ...
                },
                complete() {
                    $('#modify_user_modal').modal('hide'); // Manually hide.
                },
            });
        }
    });
    return false; // Modal never closes.
},

尽管promise评估为false，函数仍返回true

1 个答案: