【问题标题】:VeeValidate validating a non-existent field error even with key即使使用密钥,VeeValidate 也会验证不存在的字段错误
【发布时间】:2019-10-18 00:30:36
【问题描述】:

我一直试图让它工作一会儿,但我还没有找到解决方案。我已经阅读了有关 VeeValidate 动态字段的信息,但它也没有帮助。我有以下错误:

未捕获(承诺中)错误:[vee-validate] 验证不存在的字段:“#29”。首先使用“attach()”。

我的代码:

<!-- Nom de la catégorie du soin -->
                        <b-row>
                            <b-col sm="3">
                                <label>Catégorie du soin</label>
                            </b-col>

                            <!-- List or typing -->
                            <template v-if="vCatState === 'list'">
                                <b-col sm="7">
                                    <b-form-select key="a" v-model="vCategorie" id="categorySoin"
                                     @change="changeListOfServices(vCategorie)" v-validate="'required'" name="catégorie liste">

                                        <option></option>
                                        <option v-for="categoriesoin in categoriesoins" :key="categoriesoin.id" v-bind:value="categoriesoin.id">
                                            {{categoriesoin.name}}
                                        </option>

                                    </b-form-select>
                                    <span>{{ errors.first('catégorie liste') }}</span>
                                </b-col>
                            </template>
                            <template v-else-if="vCatState === 'typing'">
                                <b-col sm="7">
                                    <b-form-input key="b" type="text" v-model="vCat" id="catSoin"
                                    v-validate="'required'" name="catégorie texte"
                                    />
                                    <span>{{ errors.first('catégorie texte') }}</span>
                                </b-col>
                            </template>

                            <b-col sm="2">
                                <b-button @click="catSoin()">
                                    <font-awesome-icon icon="pen-square"/>
                                </b-button>
                            </b-col>
                        </b-row>

我有一个“选择”和“文本”可供切换。当我关闭我的模式时,我运行:this.$validator.reset();

问题是,如果我通过编辑具有“a”类型的动态字段的行然后编辑“b”类型的行来打开模式,我会收到上面提到的错误

感谢阅读

【问题讨论】:

    标签: laravel validation vue.js vuejs2 vee-validate


    【解决方案1】:

    每当通过 vue 组件显示模式时,我都会遇到这个问题。

    我通过直接分配唯一的排序键解决了这个问题

    <modal
        :edited-index="editedIndex"
        :dialog="dialog"
        :key="uniqueKey"
        @dialogAction="executeAction"
    />
    
    It's important to reset the modal state to randomly assign a value to the key on modal open event.
    

    【讨论】:

      猜你喜欢
      • 2020-11-23
      • 2017-12-24
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2018-01-09
      • 2017-10-18
      • 1970-01-01
      • 2018-08-14
      相关资源
      最近更新 更多