一.模块的安装
npm install vue-cookies --save
#--save可以不用写
二.配置main.js
// 配置cookie
import cookies from 'vue-cookies'
Vue.prototype.$cookies = cookies; //配置时候prototype.$这里的名字自己定义不是固定是cookies
三.使用
// 持久化存储val的值到cookie中
this.$cookies.set('val', this.val, 300)
// 获取cookie中val字段值
this.$cookies.get('val')
// 删除cookie键值对
this.$cookies.remove('val')
相关配置:
- 到期时间全局设置
这里是全局的设置所有的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 |
min | minute |
s | second |