@Gagatyn
Самоучка

Как асинхронно передать значение в валидатор в vuelidate?

Здравствуйте!

Для валидации поля на максимальное кол. символов использую валидатор maxLenght. В него передаю некую цифру, в данном случае взял просто значение id.
В состояние info записываю, когда срабатывает mounted().
На момент отрисовки еще нет ответа и ошибка: this.info is undefined...

Подскажите, как исправить ошибку и корректно передать значения запроса?
Использовать watch?



UPD
Ответ:
validations: {
    somethingName: {
      required,
      async maxLength(val) { // <- ответ
        const max = await this.getSettings.max;
        const length = val.length;
        if (val === "") {
          return val;
        }
        return length <= max;
      }
    }
  • Вопрос задан
  • 53 просмотра
Пригласить эксперта
Ответы на вопрос 1
@VegasChickiChicki
Vue.use(window.vuelidate.default)
const { required, minLength, maxLength } = window.validators

new Vue({
  el: "#app",
  data: {
    input: '',
    info: 20
  },
  validations: {
  	input: {
    	required,
      maxLength: maxLength(this.info.id || 20)
    }
  },
  methods: {
    getInfo: async function() {
    	let res = await fetch("https://jsonplaceholder.typicode.com/todos/20");
      this.info = await res.json().id;
    },
    onSubmit() {
    	if (this.$v.$invalid) {
        this.$v.$touch();
        return;
      }
    }
  },
  async mounted() {
  	await this.getInfo();
  }
})


Может так?
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы