vue项目 实现6个小时之内免登录

第一步：需要在登录成功之后设置6个小时的过期时间

//登录
        login(){
            if(this.phoneNum == "" ||!isvalidPhone(this.phoneNum)){
                return Toast('请填写正确的手机号'); //Toast 引入了mint-ui
            }
            if(this.vCode == ""){
                return Toast('请填写验证码');
            }
            let reqParams = {xxx}
            this.btnIsDisabled = true; //按钮防止重复点击
            this.$post('xxxx',reqParams).then(res=>{
                setExpire('userId',res.userId,6*60*60*1000);
                setExpire('userToken',res.userToken,6*60*60*1000);
                this.$router.push({
                            path: '/home'
                 }
                 this.btnIsDisabled = false;
            }).catch(err=>{
                    this.btnIsDisabled = false;
            })
        }
//免登录
        freeLogin(){
            let  userId = getExpire('userId');
            //在有效时间内
            if(userId){
                this.$router.push({
                       path: '/home'
                })
            }
        }
beforeRouteEnter(to,from,next){
        next(vm=>{
            if(!from.name){ //直接通过链接进来的，避免   正常通过登录页跳转到第二个页面 点击返回又会再跳到第二个页面的情况
                   vm.freeLogin();
            }
        });
    }

附：utils.js中 setExpire、getExpire

export function setExpire(key,value, expire){
    let obj = {
        data: value,
        time: Date.now(),
        expire: expire
    };
    localStorage.setItem(key, JSON.stringify(obj));
}
export function getExpire(key){
    let val = localStorage.getItem(key);
    if (!val) {
        return val;
    }
    val = JSON.parse(val);
    if (Date.now() - val.time > val.expire) {
        localStorage.removeItem(key);
        return null;
    }
    return val.data;
}