js-cookie的使用

js-cookie 主要是方便我们操作cookie的存储,简单好用,接下来就看一下 js-cookie 的使用方法

我们都知道平时使用 cookie 进行缓存时,主要以  储存、获取、删除 三种方式,js-cookie也是如此,避免了像原生操作 cookie 的繁琐

原生js操作cookie的麻烦

首先我们要安装一下 js-cookie

npm install --save js-cookie

安装成功后,需要在用到的文件中调用

import Cookies from 'js-cookie'

接下来就可以使用了

方法一:储存(set)

// 先开始一个简单的例子
Cookies.set('user', '咸蛋君', { expires: 3, path: '' });
// 创建一个有效的cookie这时你就会在控制台cookies里就有个name为user这个字段了,而它的value是咸蛋君
Cookies.set('user', '咸蛋君', { expires: 3 });
// 创建一个从现在起3天过期的cookie
Cookies.set('user', '咸蛋君', { expires: 3, path: '' });
// 创建对当前页面路径有效的3天过期cookie
// 接下来储存一个对象
const res = { user: '咸蛋君', age: 18 };
Cookies.set('data', res);
// 同样这时控制台cookies里又出现一个name为data的字段而它的value是一个对象

方法二:获取(get)

// 现在来获取刚才储存的数据
const user = Cookies.get('user')
// console.log(Cookies.get('user')) // 咸蛋君
// 接下来获取刚才储存的对象
const res = JSON.parse(Cookies.get('data'))  // 注意 如果不添加想要获取的name时会给你返回cookies里面所有的数据
// console.log(res) // => { uesr: '咸蛋君', ags: 18}

方法三:删除(remove)

Cookies.remove('user');
// 删除cookie里name为user的数据
Cookies.remove('user', { path: '' });
// 删除对当前页面路径有效的cookie

 

上一篇:pom.xml文件变灰出现删除线


下一篇:Cookie和Session的区别