即使我有错误 Vuejs，模态在提交表单后也会关闭

Question

我用 vuelidate 创建了一个验证，但在我提交表单后，即使我有错误，表单模态也会关闭。我正在使用 Bootstrap-Vue 和 VueJs。我希望在提交后收到错误时打开模型。

<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...