elementui记住密码
时间: 2023-10-05 11:09:47 浏览: 68
elementui记住密码功能可以通过勾选记住密码选项并将用户名和密码保存在cookie中来实现。在Vue的代码中,可以通过设置v-model绑定checkbox的值来获取是否勾选记住密码,然后将用户名和密码保存在cookie中。在登录时,判断cookie中是否存在保存的用户名和密码,如果存在则将其填充到相应的输入框中。具体的实现方法可以参考以下代码:
```html
<el-checkbox v-model="checked">记住密码</el-checkbox>
```
```javascript
// 在登录方法中进行cookie的设置和清除
methods: {
handleLogin() {
if (this.checked) {
// 将用户名和密码保存在cookie中
this.setCookie('username', this.formLogin.username, 7); // 设置保存7天
this.setCookie('password', this.formLogin.password, 7);
} else {
// 清除保存的用户名和密码
this.removeCookie('username');
this.removeCookie('password');
}
// 登录逻辑
// ...
},
// 设置cookie
setCookie(name, value, days) {
let expires = '';
if (days) {
let date = new Date();
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
expires = '; expires=' + date.toUTCString();
}
document.cookie = name + '=' + (value || '') + expires + '; path=/';
},
// 清除cookie
removeCookie(name) {
document.cookie = name + '=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;';
}
}
```
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)