vue.js - 即使我有错误Vuejs，提交表单后模态也会关闭

Question

我使用vuelidate创建了一个验证，但是在我提交表单后，即使我有错误，模式也会关闭。我正在使用带有 VueJs 的 Bootstrap-Vue。如果提交后出现错误，我希望模型打开。

<b-modal
    v-bind="$attrs"
    title="Add new customer"
    @ok="addCustomer"
>

<form ref="form" @submit.stop.prevent>
    <b-form-group label="Account Name" label-for="account_name-input">
        <b-form-input
                id="account_name-input"
                v-model="account_name"
                v-model.trim="$v.account_name.$model"
                :class="{
'is-invalid':$v.account_name.$error, 'is-valid':!$v.account_name.$invalid}"
        ></b-form-input>
        <div class="invalid-feedback">
            <span v-if="!$v.account_name.required">This field is required!</span>
        </div>
    </b-form-group>
</form>

addCustomer() {
    if (this.$v.$invalid) {
        console.log('Error');
    }else{
        console.log("Succes");
        let newCustomer = {
            account_name: this.account_name,
        };

        ...code...
    }
},

validations: {
    account_name: {
        required
    },
}

Answer 1

我再次阅读了文档，并找到了解决方案。我加了这个 bvModalEvt.preventDefault()

addCustomer(bvModalEvt) {
    if (this.$v.$invalid) {
        bvModalEvt.preventDefault()
        console.log('Error');
    }else{
...code...