记住密码

103 阅读1分钟

微信截图_20240221160515.png

  <el-checkbox v-model="checked" class="remember">记住我</el-checkbox>
  <el-button :loading="loading" plain @click.native.prevent="handleLogin">登 录</el-button>
 mounted() {
    let username = localStorage.getItem("username");
    if (username) {
      this.loginForm.username = localStorage.getItem("username");
      this.loginForm.password = window.atob(localStorage.getItem("password")); // 解密
      this.checked = true;
    }
  },

 methods: {
    handleLogin() {
    // 1. 表单校验
      this.$refs.loginForm.validate((valid) => {
        if (valid) {
          this.loading = true;
          // 2. 判断是否勾选记住密码
          if (this.checked) {
            let password = window.btoa(this.loginForm.password); // 加密
            localStorage.setItem("username", this.loginForm.username);
            localStorage.setItem("password", password);
          } else {
            localStorage.removeItem("username");
            localStorage.removeItem("password");
          }
          // 3. 发送登录请求
          this.$store
            .dispatch("user/login", this.loginForm)
            .then(() => {
              this.$router.push({ path: this.redirect || "/" });
              this.loading = false;
            })
            .catch(() => {
              this.loading = false;
            });
        } else {
          return false;
        }
      });
    }
  }