Ve-подтвердить с несколькими областями и одной кнопкой отправки - PullRequest
Новая
       12

Ve-подтвердить с несколькими областями и одной кнопкой отправки

0 голосов
/ 16 ноября 2018

У меня есть форма, где пользователь может добавить дополнительные строки. Каждая строка содержит несколько полей ввода. Я хотел бы проверять каждую строку независимо друг от друга и отображать только одно сообщение об ошибке на строку.

Вот как я зацикливаю строки и добавляю область к каждой строке 

<div v-for="(item, index) in sizes" :key='index' :data-vv-scope="`row${index}`">
  // error message
  <p v-show="errors.has('sizesErrorMsg')">{{ errors.first('sizesErrorMsg') }}</p>
  //start of inputfields
  <div>
    <input type="text" name="prefix" v-model="item.prefix" v-validate="{ required: true }" :class="{'error': errors.has('prefix')}">
  </div>
  <div>
    <input class="checkbox" type="checkbox" id="ratio">
  </div>
  <div>
    <input type="text" name="width" v-model="item.width" v-validate="{ required: true }" :class="{'error': errors.has('width')}">
  </div>
    ...
    ...
<div>
<button @click.prevent="addSize">Add<button>
<button @click="save">Save</button>

И при отправке я снова зацикливаюсь на всех строках и использую validateAll с областью действия 

for (let i = 0; i < sizes.length; i++) {
  this.$validator.validateAll(`row${i}`).then((result) => {
    if (result) {
      // no error
    } else {
      const message = this.$validator.dictionary.getMessage('de', 'sizesErrorMsg');
      this.errors.add({
        scope: null,
        field: 'sizesErrorMsg',
        msg: message
      });
    }
  });
}

Но если я использую прицел, он не выдает никаких ошибок. Что я делаю не так?

веселит, Грегор

...