小程序
小游戏
企业微信
微信支付
扫描小程序码分享
vue中实现全局Cookie的方法
1 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
import Vue from 'vue' import Vuex from 'vuex' import VueRouter from 'vue-router' import App from '../component/App.vue' import Login from '../component/Login.vue' import UserInfo from '../component/UserInfo.vue' //状态管理 Vue.use(Vuex) //路由 Vue.use(VueRouter) //路由配置 //如果需要加菜单,就在这里添加路由,并在UserMenu.vue添加入口router-link const router = new VueRouter({ routes: [{ path: '/login', component: Login }, { path: '/user_info', component: UserInfo }] }) //Vuex配置 const store = new Vuex.Store({ state: { domain:'http://test.example.com', //保存后台请求的地址,修改时方便(比方说从测试服改成正式服域名) userInfo: { //保存用户信息 nick: null, ulevel: null, uid: null, portrait: null } }, mutations: { //更新用户信息 updateUserInfo(state, newUserInfo) { state.userInfo = newUserInfo; } } }) //设置cookie,增加到vue实例方便全局调用 Vue.prototype.setCookie = (c_name, value, expiredays) => { var exdate = new Date(); exdate.setDate(exdate.getDate() + expiredays); document.cookie = c_name + "=" + escape(value) + ((expiredays == null) ? "" : ";expires=" + exdate.toGMTString()); } //获取cookie Vue.prototype.getCookie = (name) => { var arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)"); if (arr = document.cookie.match(reg)) return (arr[2]); else return null; } //删除cookie Vue.prototype.delCookie =(name) => { var exp = new Date(); exp.setTime(exp.getTime() - 1); var cval = this.getCookie(name); if (cval != null) document.cookie = name + "=" + cval + ";expires=" + exp.toGMTString(); } //vue实例 var app = new Vue({ data: {}, el: '#app', render: h => h(App), router, store, watch:{ "$route" : 'checkLogin' }, created() { this.checkLogin(); }, methods:{ checkLogin(){ //检查是否存在session if(!this.getCookie('session')){ this.$router.push('/login'); }else{ this.$router.push('/user_info'); } } } })
你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。
关注后,可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
import Vue from 'vue' import Vuex from 'vuex' import VueRouter from 'vue-router' import App from '../component/App.vue' import Login from '../component/Login.vue' import UserInfo from '../component/UserInfo.vue' //状态管理 Vue.use(Vuex) //路由 Vue.use(VueRouter) //路由配置 //如果需要加菜单,就在这里添加路由,并在UserMenu.vue添加入口router-link const router = new VueRouter({ routes: [{ path: '/login', component: Login }, { path: '/user_info', component: UserInfo }] }) //Vuex配置 const store = new Vuex.Store({ state: { domain:'http://test.example.com', //保存后台请求的地址,修改时方便(比方说从测试服改成正式服域名) userInfo: { //保存用户信息 nick: null, ulevel: null, uid: null, portrait: null } }, mutations: { //更新用户信息 updateUserInfo(state, newUserInfo) { state.userInfo = newUserInfo; } } }) //设置cookie,增加到vue实例方便全局调用 Vue.prototype.setCookie = (c_name, value, expiredays) => { var exdate = new Date(); exdate.setDate(exdate.getDate() + expiredays); document.cookie = c_name + "=" + escape(value) + ((expiredays == null) ? "" : ";expires=" + exdate.toGMTString()); } //获取cookie Vue.prototype.getCookie = (name) => { var arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)"); if (arr = document.cookie.match(reg)) return (arr[2]); else return null; } //删除cookie Vue.prototype.delCookie =(name) => { var exp = new Date(); exp.setTime(exp.getTime() - 1); var cval = this.getCookie(name); if (cval != null) document.cookie = name + "=" + cval + ";expires=" + exp.toGMTString(); } //vue实例 var app = new Vue({ data: {}, el: '#app', render: h => h(App), router, store, watch:{ "$route" : 'checkLogin' }, created() { this.checkLogin(); }, methods:{ checkLogin(){ //检查是否存在session if(!this.getCookie('session')){ this.$router.push('/login'); }else{ this.$router.push('/user_info'); } } } })