Vue-CLI项目-vue-cookie与vue-cookies处理cookie

vue-cookie

一.模块的安装

npm i vue-cookie -S

二.配置main.js

**// 配置cookie**
import cookie from 'vue-cookie'
Vue.prototype.$cookie = cookie;  //配置时候prototype.$这里的名字自己定义不是固定是cookie

三.使用

created() {//创建时间节点
    console.log('组件创建成功');
    let token = 'asd1d5.0o9utrf7.12jjkht';
    // 设置cookie默认过期时间单位是1d(1天)
    this.$cookie.set('token', token, 1);
},
mounted() {//创建渲染节点
    console.log('组件渲染成功');
    let token = this.$cookie.get('token');
    console.log(token);
},
destroyed() {//组件销毁节点
    console.log('组件销毁成功');
    this.$cookie.delete('token')
}

概述:

创建:this. 配 置 时 候 设 置 的 名 称 . s e t ( ′ c o o k i e s 的 k e y ′ , v a l u e , 时 间 最 小 单 位 为 天 且 一 定 要 为 整 数 ) 获 取 指 定 的 k e y : t h i s . 配置时候设置的名称.set('cookies的key',value,时间最小单位为天且一定要为整数) 获取指定的key:this. .set(cookieskey,value,)key:this.配置时候设置的名称.get('cookies的key) 删除:this.$配置时候设置的名称.delete('cookies的key)这里删除如果没有重启浏览器cookies还在的,不过值为空重启浏览器cookies才消失;

vue-cookies

//一模块的安装
npm i vue-cookies -S

二.配置main.js

// 配置cookie
import cookies from 'vue-cookies'
Vue.prototype.$cookies = cookies;  //配置时候prototype.$这里的名字自己定义不是固定是cookies

三.使用
概述:

  1. 创建:this.$配置时候;

  2. 设置的名称.set(‘cookies的key’,value)获取指定的key:this.$配置时候设置的名称.get('cookies的key`);

  3. 获取所有keys返回为数组的形式:this. 配 置 时 候 设 置 的 名 称 . k e y s ( ′ c o o k i e s 的 k e y ‘ ) 删 除 : t h i s . 配置时候设置的名称.keys ('cookies的key`) 删除:this. .keys(cookieskey):this.配置时候设置的名称.remove('cookies的key`)
    这里删除如果没有重启浏览器cookies还在的,不过值为空 重启浏览器cookies才消失

  4. 检查某个 cookie
    name是否存在:this.$配置时候设置的名称.isKey('cookies的key`)
    相关配置:到期时间全局设置,这里是全局的设置所有的cookie都会生效:

this.$cookies.config('固定时间') //填的值1d为一天,1h为一小时,1min为一分钟,1s为1秒


//指定时间
this.$cookies.config(new Date(2020,12,1))
this.$cookies.config("Sat, 13 Mar 2017 12:25:57 GMT")

//如果是乘法
this.$cookies.config(60*60) //是60s*60s依次类推

//如果是单单空数组
this.$cookies.config(60) //也是60S
单个cookie设置
//不写过期时间,默认为1天过期
this.$cookies.set("user_session","25j_7Sl6xDq2Kc3ym0fmrSSk2xV2XkUkX")

// 1天过期,忽略大小写
this.$cookies.set("user_session","25j_7Sl6xDq2Kc3ym0fmrSSk2xV2XkUkX","1d")
this.$cookies.set("user_session","25j_7Sl6xDq2Kc3ym0fmrSSk2xV2XkUkX","1D")

// 以秒为单位,设置1天过去
this.$cookies.set("user_session","25j_7Sl6xDq2Kc3ym0fmrSSk2xV2XkUkX",60 * 60 * 24)

// 填写Date对象,明确指定过期时间
this.$cookies.set("user_session","25j_7Sl6xDq2Kc3ym0fmrSSk2xV2XkUkX", new Date(2017, 03, 12))

// 填写一个时间字符串,指定过期时间
this.$cookies.set("user_session","25j_7Sl6xDq2Kc3ym0fmrSSk2xV2XkUkX", "Sat, 13 Mar 2017 12:25:57 GMT")

//浏览器会话结束时过期
this.$cookies.set("default_unit_second","input_value","0");
 
//永不过期
this.$cookies.set("default_unit_second","input_value",-1); 

设置过期时间,输入字符串类型(字符均忽略大小写):

Unit full name
y year
m month
d day
h hour
h hour
min minute
s second

你可能感兴趣的:(vue)