点击登录,页面弹出红色报错遮罩层,代码不运行怎么解决！

这方法我也不知道用的合理不合理，但是确实阻止了网页弹出红色遮罩层。

首先是axios响应拦截器的处理！

server.interceptors.response.use(
  (response) => {
    //   console.log(response)
    const { data, meta } = response.data
    //   .use是有响应 响应成功  第一个函数 是响应成功调用的
    if (meta.status == 200 || meta.status === 201) {
      return data
    } else {
        ElMessage.error(meta.msg)
        return Promise.reject(new Error(meta.msg))
    }
  },
  (error) => {
    // 第二个函数时没有返回响应的时候调用
    // 就是密码输入错误的时候 处理的东西
    // console.log(error.response, 'ww')
    // console.log(error);
    error.response && ElMessage.error(error.response.data)
    return Promise.reject(new Error(error.response.data))
  }
)

else的时候return 出错误的promise  然后login.vue界面的登录接口会接收到这个错误的Promise！

下面是登录页面的操作,

// 获取form组件实例
const formRef = ref(null)
// 登录的点击事件
const handleLogin = () => {
  console.log(formRef)
  formRef.value.validate(async (valid) => {
    // valid是检查form表单里面的内容是否全部通过正则 全部通过则valid是true
    if (valid) {
      try {
        const res = await login(form.value) //如果登录失败 这里会接收到一个错误的Promise 然后用catch拦截 来阻止页面弹出红色遮罩层
      } catch (error) {}
    } else {
      return false
    }
  })
}