0

每当我尝试执行表单验证时,应用程序都会挂起。当尝试使用 vuelidate 应用程序工作但我们注销时,默认重定向到登录后,验证消息显示并且应用程序挂起。下面是没有第三方的自定义验证的示例代码。如何解决这个问题

<form novalidate class="form-con">
            <ion-item
              lines="none"
              class="phone pdl-0 animate__animated animate__fadeInRight"
            >
              <ion-icon
                :ios="mailOutline"
                :md="mailOutline"
                class="ft-14 icon-color"
              ></ion-icon>
              <ion-input
                class="auth-input-el"
                type="email"
                name="email"
                placeholder="Email"
                v-model="email"
                :ionInput="emailOnChange()"
              ></ion-input>
            </ion-item>
            <div v-if="errors.email" class="validation-msg">
              {{ errors.email }}
            </div>
            <ion-item
              lines="none"
              class="
                password
                pdl-0
                fd-mt
                animate__animated animate__fadeInRight
              "
            >
              <ion-icon
                :ios="lockClosedOutline"
                :md="lockClosedOutline"
                class="ft-14 icon-color"
              ></ion-icon>
              <ion-input
                class="auth-input-el"
                type="text"
                name="password"
                placeholder="Password"
                style="-webkit-text-security: disc"
                v-model="password"
                :ionInput="passwordOnChange()"
              ></ion-input>
            </ion-item>
            <div v-if="errors.password" class="validation-msg">
              {{ errors.password }}
            </div>
            <div
              class="
                ion-padding ion-text-center
                pb-0
                fm-btn
                animate__animated animate__fadeInRight
              "
            >
              <ion-button
                class="text-transform-none"
                expand="block"
                @click="login"
              >
                Login
              </ion-button>
            </div>
          </form>

validateForm() {
      this.errorCount = 0;
      this.emailOnChange();
      this.passwordOnChange();
      return this.errorCount > 0 ? false : true;
    },
    emailOnChange() {
      if (
        this.formSubmitted &&
        (!this.email || !this.constants.emailReg.test(this.email))
      ) {
        this.errors.email = this.constants.email;
        this.errorCount++;
      } else this.errors.email = "";
    },
    passwordOnChange() {
      if (this.formSubmitted) {
        if (!this.password) {
          this.errors.password = this.constants.password;
          this.errorCount++;
        } else this.errors.password = "";
      }
    },
    login() {
      this.formSubmitted = true;
      if (!this.validateForm()) return;}
4

0 回答 0