@alexandr-web
Программист

Почему не проходит валидация vuelidate?

При авторизации у меня не проходит валидация vuelidate из-за параметра email, хотя написано правильно:

<template>
  <form
    class="form auth__form" 
    @submit.prevent="login"
  >
    <div class="form__field auth__form-field">
      <label
        class="form__label auth__form-label"
        for="email"
      >
        <h4 class="form__field-title auth__form-field-title">Email пользователя</h4>
        <input
          id="email"
          v-model.trim="$v.email.$model"
          class="form__input auth__form-input input"
          type="text"
          placeholder="Написать email"
          name="email"
          :class="{ 'input--invalid': $v.email.$error }"
        >
      </label>
    </div>
    <button
      class="form__submit auth__form-submit"
      :disabled="pending"
      type="submit"
    >
      Войти
    </button>
  </form>
</template>

<script>
  import {
    required,
    email,
  } from "vuelidate/lib/validators";

  export default {
    name: "LoginFormComponent",
    props: { pending: { type: Boolean, required: true, }, },
    validations: {
      email: {
        required,
        email,
      },
    },
    methods: {
      login() {
        this.$v.$touch();

        // { ..., email: false, required: true, }; "email@mail.com"
        console.log(this.$v.email, this.$v.email.$model);

        if (!this.$v.$invalid) {
          this.$emit("login", { email: this.$v.email.$model, });
        } else {
          alert("Все поля должны быть заполнены!");
        }
      },
    },
  };
</script>


Никаких ошибок нет
  • Вопрос задан
  • 55 просмотров
Пригласить эксперта
Ваш ответ на вопрос

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

Похожие вопросы