前端登录实现记住密码功能

1.在登录的表单中添加记住密码勾选框

<el-form-item>
    <el-checkbox name="type" v-model="remember"></el-checkbox><span>记住密码</span>
</el-form-item>

2.data中定义

remember:false

3.methods中定义方法

rememberInfo() {
        // 判断用户是否勾选记住密码，如果勾选，在本地储存中储存登录信息
        if(this.remember){
            localStorage.setItem("account",this.form.account)  
            localStorage.setItem("password",this.form.password)
        }
      }

4.methods中登录接口成功的回调中使用rememberInfo方法

toLogin(params).then(r=>{
    if(r.code == 200){
	this.rememberInfo()
	//以及需求中的一些操作 类似存储token信息 角色信息等等
    }
}

5.created里面

 //如果本地储存了账号密码信息，那就回显在输入框
      let account = localStorage.getItem('account')
      let password = localStorage.getItem('password')
       if( account && password ){
           this.form.account = localStorage.getItem('account')
           this.form.password = localStorage.getItem('password')
           this.remember = true //这一步是回显后让勾选框为选中状态
       }