【vue】cookie保存用户登陆信息

.html

<el-form :model="form" ref="form" :show-message="false" @submit.native.prevent="submitForm('form')" v-loading="loading">
 	<el-form-item prop="account">
     	<el-input
        	placeholder="账号"
            prefix-icon="el-icon-user"
            v-model="form.account">
        </el-input>
    </el-form-item>
    <el-form-item prop="pwd">
    	<el-input
            placeholder="密码"
            prefix-icon="el-icon-view"
            v-model="form.pwd">
        </el-input>
    </el-form-item>
    <el-form-item style="margin-bottom: 0;">
    	<el-button
        	type="primary"
            style="width: 100%"
            native-type="submit">
            登录</el-button>
    </el-form-item>
</el-form>

登录页面main.js

export default {
    name: "login",
    data() {
        return {
            form: {
                account: '',
                pwd: ''
            },
            loading:false
        };
    },
    methods: {
        submitForm(form) {
            let _vm = this;
            //判断账号密码是否为空（其他格式校验由接口返回）
            if (_vm.form.account == ""){
            	_vm.$message.error("请输入账号")
                return
            }
            if (_vm.form.pwd == ""){
                _vm.$message.error("请输入密码")
                return
            } 
            //调用接口登录
            _vm.loading = true;
            _vm.$refs[form].validate((valid) => {
                if (valid) {
                //封装的调接口方法，这里不再展示
                    wh.generalHttpRequest({
                        url: '',
                        method: 'post',
                        data:{}
                    }, (dat) => {
                        if(dat.data.status){
                            //保存用户信息
                            let userInfo = dat.data.resultData.userInfo
                            //转成字符串存储
                            if(userInfo){
                                userInfo = JSON.stringify(userInfo)
                            }
                            _vm.setCookie(userInfo,7);
                            _vm.loading = false;
                            //跳转至主页面
                            _vm.$router.push({
                                path:""
                            })
                        }else{
                           //
                        }
                    })
                } else {
                    return false
                }
            });
        },
        //设置cookie
        setCookie(jwt,userInfo,exdays) {
            let exdate=new Date();
            exdate.setTime(exdate.getTime() + 24*60*60*1000*exdays);//保存的天数
            //字符串拼接cookie
            window.document.cookie="userInfo" + "=" + userInfo + ";path=/;expires=" + exdate.toGMTString();
        },
        //清除cookie
        clearCookie(){
            this.setCookie("","",-1)
        }
    }
}

主页面获取cookie信息

//封装了一个方法，每个页面都可以调用
wh.getCookie = function (pram) {
    if (document.cookie.length > 0) {
        let arr = document.cookie.split('; ');//通过; 将数据转成数组
        for(var i=0;i<arr.length;i++){
            let index = arr[i].indexOf("=") //返回第一个“=”所在的位置
            if(arr[i].subString(0,index)==pram){
            	return arr[i].subString(index+1)
            }
        }
    }
    return ""
}

//页面中调用
    let userInfo = wh.getCookie("userInfo")
    userInfo = JSON.parse(userInfo)