VeeValidate 3 сообщение об ошибке setErrors для текущего изменения входа - PullRequest
Новая
       105

VeeValidate 3 сообщение об ошибке setErrors для текущего изменения входа

1 голос
/ 05 августа 2020

У меня есть проверка на двух входах. И я хочу установить сообщение об ошибке на двух входах, используя метод setErrors () vee-validate в то же время, когда я изменяю данные во входе. Проблема: не отображать сообщение об ошибке в текущих данных изменения ввода Ожидаемый результат: я хочу видеть сообщение об ошибке на двух входах. 

<template>
  <div>
    <ValidationObserver ref="adad" v-slot="{ passes }">
      <ValidationProvider name="min" mode="lazy" rules="required" v-slot="{ errors }">
        <input type="number" v-model.number="minValue" @change="handleErrors">
        <span>{{ errors[0] }}</span>
      </ValidationProvider>
      <ValidationProvider name="max" mode="lazy" rules="required" v-slot="{ errors }">
        <input type="number" v-model.number="maxValue" @change="handleErrors">
        <span>{{ errors[0] }}</span>
      </ValidationProvider>
      <button @click="passes(handleErrors)">Validate</button>
    </ValidationObserver>
  </div>
</template>

<script>
import { extend } from "vee-validate";

extend("between", {
  params: ["min", "max"],
  validate(value, { min, max }) {
    return value >= min && value <= max;
  },
  message: "This field value must be between {min} and {max}"
});

export default {
  data: () => ({
    minValue: 0,
    value: 1,
    maxValue: 10
  }),
  methods: {
    handleErrors() {
      console.log("====> handleErrors");
      this.$refs.adad.setErrors({
        min: "hello world",
        max: "hello world"
      });
    }
  }
};
</script>
...