【小昆山官网】忘记密码页面-输入密码格式不对时，点击修改密码报错

digital-park-web/digital-park/src/views/login/LoginFrom/LoginFrom.vue

                             v-model="newPassword"
                             show-password
                             class="mb-20"
-                            :class="{'is-error':newPasswordError}"
+                            :class="{'is-error':newPasswordError || newPasswordReg}"
                             @focus="clearError('newPasswordError')"
                             maxlength="16"
                         >
                     </form>
 
                     <div class="is-error-info" v-if="newPasswordError">请输入新密码</div>
+                    <div class="is-error-info" v-if="newPasswordReg">密码只能包含字母、数字且长度需要在8和16之间</div>
+
                     <form>
                         <el-input
                             placeholder="请再次输入新密码"
                             show-password
                             class="mb-20"
                             maxlength="16"
-                            :class="{'is-error':confirmPasswordError}"
+                            :class="{'is-error':confirmPasswordError || confirmPasswordReg}"
                             @focus="clearError('confirmPasswordError')"
+                            @blur="checkPassword"
                         >
                             <i slot="prefix" class="el-input__icon el-icon-lock"></i>
                         </el-input>
                     </form>
 
-                    <div class="is-error-info" v-if="confirmPasswordError">请输入新密码</div>
+                    <div class="is-error-info" v-if="confirmPasswordError">请再次输入新密码</div>
+                    <div class="is-error-info" v-if="confirmPasswordReg">两次新密码不一致</div>
                     <div class="verification-code-row mb-20">
                         <el-input
                             placeholder="请输入图片验证码"
             // 新密码
             newPassword: "",
             newPasswordError: false,
+            newPasswordReg: false,
             // 确认密码
             confirmPassword: "",
             confirmPasswordError: false,
+            confirmPasswordReg: false,
             // 记住密码
             isRemember: false,
             // 加密码
                 .then((res) => {
                     const data = res.data;
                     if (data.status == 0) {
-                        
                         // 保存用户名
                         setCookie("accountName", accountName.trim());
                         // 判断是否勾选记住密码
         // 登录成功后的响应
         loginSuccessFn() {
             let getLoginFrom = localStorage.getItem("loginFrom") || "/";
-            this.$store.dispatch('getUserInfo').then(()=>{
+            this.$store.dispatch("getUserInfo").then(() => {
                 this.$router.push(getLoginFrom);
-            })
+            });
         },
         // 检测是否通过
         checkIsAllow(checkKeyList) {
                 this[key] = true;
                 flag = false;
             }
+            if (key == "mobilePhoneError" && !/^1\d{10}$/.test(val)) {
+                this[key] = true;
+                flag = false;
+            }
             if (
-                key == "mobilePhoneError" &&
-                !/^1\d{10}$/.test(val)
+                key == "newPasswordError" &&
+                val &&
+                !/^[A-Za-z0-9]{8,16}$/.test(val)
             ) {
-                this[key] = true;
+                this.newPasswordReg = true;
                 flag = false;
             }
+            if (
+                key == "confirmPasswordError" &&
+                val &&
+                this.newPassword !== this.confirmPassword
+            ) {
+                this.confirmPasswordReg = true;
+            }
             return flag;
         },
         // 清楚错误
         clearError(key) {
             this[key] = false;
+            if (key == "newPasswordError") {
+                this.newPasswordReg = false;
+            }
+            if (key === "confirmPasswordError") {
+                this.confirmPasswordReg = false;
+            }
+        },
+        checkPassword() {
+            if (
+                this.confirmPassword &&
+                this.newPassword &&
+                this.newPassword !== this.confirmPassword
+            ) {
+                this.confirmPasswordReg = true;
+            }
         },
         // 清除所有错误
         clearAllError() {
             this.passwordError = false;
             this.newPasswordError = false;
             this.confirmPasswordError = false;
+            this.confirmPasswordReg = false;
+            this.newPasswordReg = false;
             this.imgCodeError = false;
             this.phoneCodeError = false;
             this.mobilePhoneError = false;