首页 > 其他 > 详细

vue中cookie的使用

时间:2019-11-05 19:55:07      阅读:88      评论:0      收藏:0      [点我收藏+]

vue中的cookie:

主要是做传入cookie、获取cookie值、删除cookie,最后封装好,调用cookie

 

网址链接:https://blog.csdn.net/qq_33645229/article/details/81672167

 

//获取cookie
export function getCookie(name) {
var arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)");
if (arr = document.cookie.match(reg))
return (arr[2]);
else
return null;
}

 

//设置cookie,增加到vue实例方便全局调用
export function 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
export function delCookie (name) {
var exp = new Date();
exp.setTime(exp.getTime() - 1);
var cval = getCookie(name);
if (cval != null)
document.cookie = name + "=" + cval + ";expires=" + exp.toGMTString();
};

 

调用:

可以在main.js内进行一下全局掉用,也可以在你使用的组件内来进行调用它,这里是在父组件内进行的调用:

 

<script>
import Vue from ‘vue‘
import {setCookie, getCookie, delCookie} from ‘./util/util.js‘;
//参数因为是三个方法,所以用大括号来进行调用了,路径一定要写对
export default {
name: ‘App‘,
   beforeMount () {
  Vue.prototype.$cookieStore = {
    setCookie,
    getCookie,
    delCookie
  }
   }
}

</script>

 

 

开始 的时候要先进行传入cookie值传的方法,看代码

this.$cookieStore.setCookie( ‘name‘ , this.ruleForm2.name)
//‘name’是你自己取得名字,后面的this.ruleForm2.name是我写的一个input内v-model的值


最后在页面里进行使用获取的时候,可能就有很多人就像我一样懵了不知道应该怎么调用了,其实只需要放上一句话就行,看代码

this.$cookieStore.getCookie( ‘name‘)


删除也是一样

this.$cookieStore.delCookie( ‘name‘);


注意:

name名字是不能取不一样的啊,当你传入‘name’了你获取和删除也要都用name才行

 

此处仅作交流学习,版权归原作者所有

 

vue中cookie的使用

原文:https://www.cnblogs.com/w-yue/p/11800026.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!