记住密码篇

之前在做的项目做了记住密码的这么一个小功能，这里记录下思路？？？？？
思路：
1.第一次点击记住密码时，需要将记住密码的状态记住，将用户的信息保存在本地（这里的信息中的密码时加密之后的）
2.当用户第二次进入时，要回显出来基本信息
3.当除第一次进入的其他 情况时登录，用户可以修改这种状态是记住还是不记住，如果选择不记住的话，将保存在本地的信息移除
如果这时没有改变状态，还是记住状态，这时需要注意，这里的密码时加密过的密码，所以给后端传参的时候不在需要加密

<template>
<div class="remember">
   <span>记住密码？</span>
   <van-switch
      v-model="checked"
      active-color="#07c160"
      inactive-color="#ccc"
      size="16px"
      @change="changeStatus"
   />
</div></template>

<script>
created(){
    this.remember = JSON.parse(getStore('remember'))
    if (this.remember && this.platformName == 'inst') {
       this.checked = true;
       this.phone = this.remember.phone;
       this.password = this.remember.password;
       this.role = this.remember.role;
       this.bankName = this.remember.bankName;
       this.bankId = this.remember.bankId;
       this.userType = this.remember.userType;
    } else {
       this.phone = "";
       this.password = "";
    }
}
// 1.点击开关状态切换是否记住密码
changeStatus(checked) {
   let that = this;
   //2. 如果密码为空的时候，返回提示密码不能为空
   if (!that.password) {
      Toast('密码不能为空');
      that.checked = false
      return false;
   }
   that.checked = checked;
   // 3.记住选择状态，当选择是不记住密码时，这里需要下清空手机号和密码
   if (!that.checked) {
      that.phone = "";
      that.password = "";
   }
}

// 点击登录时
    login() {
   let that = this
   // 1.密码加密处理
   if (that.password) {
      that.md5Password = $.md5(that.password);
   }
   if (that.loginType == 1) {
      if (!checkPhone(that.phone)) return
   }
   if (that.loginType == 2) {
         if(that.rememberPass==true){
         // 思路，用户如果点击密码后，1. 判断一下是否是第一次记住密码，如果不是第一次的话，上一次点击的时候将信息已经保存在了本地，所以这时候登录的时候已经是返显了加密过的密码，所以不需再一次加密
         if(that.remember&&that.phone==that.remember.phone&&that.password==that.remember.password){
            that.md5Password=that.remember.password;
         }else {
             // 这里表示第一次点击记住密码按钮，需要将用户填的信息，保存到本地，以便下次用户进入回显
            let remember={
               phone: that.phone,
               password: that.md5Password,
               userType: that.userType, // 用户身份
               bankId: that.bankId, // 各个银行id
               typetxt: that.typetxt,  // 银行
               bankName: that.bankName,
               type: that.type
            }
            // 这里说明也说明是第一次记住密码，所以需要将相关信息保存到本地，方便下次进入登录时回显
            setStore('remember',remember);
         }
      }else {
          // 之后没次登录的时候不记住的话，就移除保存的信息，因为下次已经不需要回显了
         removeStore('remember');
      }
   }
   if (this.phone && !/^1[3|4|5|7|8][0-9]{9}$/.test(this.phone)) {
      this.message('请正确填写手机号')
   }
   let getlogin = that.ajaxRequest({
      type: 'post',
      url: '/user/userLogin',
      param: {
         phone: that.phone || null,
         username: that.username || null,
         type: that.type || null,
         userType: that.userType || null,  // 身份
         bankType: that.bankType || null,  // 银行
         position: that.position || null,
         bankId: that.bankId || null,    // 各个银行id
         password: that.md5Password || null,
         smsCode: that.smsCode || null,
         loginType: that.loginType || null,
      },
      dataType: 'json',
      successfn: function (res) {
         console.log('登录', res.data)
         if (res.data) {
            let userInfo = res.data
            setStore('userInfo', userInfo);

            if (that.loginType == 1) {
               that.pageJump('/index');
            } else if (that.loginType == 2) {
               that.pageJump('/xxxxIndex');
            } else if (that.loginType == 3) {
               that.pageJump('/xxxIndex');
            } else if (that.loginType == 4) {
               that.pageJump('/index');
            }
         }
      },
      errorfn: function (e) {
         console.log(e)
         that.message(e.msg)
      }
   })
},
</script>