uniapp实现登录的时候记住账号密码功能

直接上干货

1.记住账号密码组件

   
        
          
          
            记住账户密码
          
        
      

2.定义勾选状态

export default {
  data() {
    return {
      codeUrl: "",
      captchaEnabled: true,
      // 用户注册开关
      register: true,
      globalConfig: getApp().globalData.config,
      loginForm: {
        userName: "",
        password: "",
        captcha: "",
        key: '',
        checked: false,
      },
      rememberPsw: true,//记住密码字段，默认为记住密码

    }
  },

3.登录成功后保存账号密码到缓存中，下边这段代码是放到你登录成功之后的

 // 如果勾选了记住账号密码就保存账号密码到缓存中
        if (this.rememberPsw) {
          uni.setStorageSync("HBremember", this.rememberPsw);
          uni.setStorageSync("HBuserName", this.loginForm.userName);
          uni.setStorageSync("HBpassword", this.loginForm.password);
        } else {
          // 销毁缓存中的账号、密码
          uni.removeStorageSync("HBremember");
          uni.removeStorageSync("HBuserName");
          uni.removeStorageSync("HBpassword");
        }

4.进入页面的时候加载缓存中的账号密码

    onLoad() {
      //取出缓存中的账号、密码
      const HBremember = uni.getStorageSync("HBremember");
      const HBuserName = uni.getStorageSync("HBuserName");
      const HBpassword = uni.getStorageSync("HBpassword");
      if (HBremember && HBuserName && HBpassword) {
        this.loginForm.userName = HBuserName;
        this.loginForm.password = HBpassword;
        this.rememberPsw = HBremember;
      }
      console.log(HBremember,HBuserName,HBpassword,909999);
    },

5.登录验证

点击记住账号密码登录退出后将保存账号跟密码

不记住账号密码登录退出后不保存账号跟密码，并且没有选中记住账号和密码

以上代码都是核心代码不会的可以评论区留言我解答。