vue 后台管理系统登录 记住密码 功能(Cookies实现)

6 篇文章 0 订阅

安装插件  

import Cookies from 'js-cookie'

组件引入

import Cookies from 'js-cookie';

存值:

   Cookies.set('username', state.account, { expires: 30 });
// username 存的值的名字,state.account 存的值  expires 存储的时间,30天
   Cookies.set('password', state.password, { expires: 30 });
   Cookies.set('rememberMe', state.rememberMe, { expires: 30 });

取值:

  const username = Cookies.get('username');
    const password = Cookies.get('password');
    const rememberMe = Cookies.get('rememberMe');

登录记住密码的逻辑

function handleLogin() { // 登录
    if (state.account && state.password) {
        if (state.rememberMe) { // 记住密码被勾选
            Cookies.set('username', state.account, { expires: 30 });
            Cookies.set('password', state.password, { expires: 30 });
            Cookies.set('rememberMe', state.rememberMe, { expires: 30 });
        } else { // 记住密码取消勾选
            // 否则移除
            Cookies.remove('username');
            Cookies.remove('password');
            Cookies.remove('rememberMe');
        }
        router.push('/')
        ElMessage.success('登录成功')

    } else {
        ElMessage.warning('请输入账号密码')
    }

};

function getCookie() {
    const username = Cookies.get('username');
    const password = Cookies.get('password');
    const rememberMe = Cookies.get('rememberMe');

    state.account = username === undefined ? state.account : username
    state.password = password === undefined ? state.password : password
    state.rememberMe = rememberMe === undefined ? false : Boolean(rememberMe)
};

getCookie();

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值