vue项目登录方法记录

最新推荐文章于 2023-07-09 10:44:11 发布

热爱°可抵岁月漫长

最新推荐文章于 2023-07-09 10:44:11 发布

阅读量434

点赞数

本文链接：https://blog.csdn.net/weixin_46337813/article/details/116100861

版权

这篇博客详细记录了在Vue项目中实现登录功能的过程，包括表单验证、Cookie的设置与移除，以及登录状态的管理。当用户选择记住账号时，使用Cookies存储用户名和加密后的密码，并在登录成功后跳转到指定页面。若未选择记住，将清除相关Cookies。

摘要由CSDN通过智能技术生成

vue项目登录方法记录

 handleLogin() {
      this.$refs.loginForm.validate((valid) => {
        if (valid) {
          this.loading = true;
          if (this.loginForm.rememberMe) {
            Cookies.set("username", this.loginForm.username, { expires: 30 });
            Cookies.set("password", encrypt(this.loginForm.password), {
              expires: 30,
            });
            Cookies.set("rememberMe", this.loginForm.rememberMe, {
              expires: 30,
            });
          } else {
            Cookies.remove("username");
            Cookies.remove("password");
            Cookies.remove("rememberMe");
          }
          this.$store
            .dispatch("Login", this.loginForm)
            .then(() => {
              this.$router.push({ path: this.redirect || "/" }).catch(() => {});
            })
            .catch(() => {
              this.loading = false;
              this.getCode();
            });
        }
      });