該插件解決了原生js操作cookie的麻煩

js-cookie使用方法

js-cookie用來(lái)處理cookie相關(guān)的插件，非常簡(jiǎn)單好用，下面簡(jiǎn)單記錄一下：

1、項(xiàng)目中引用：

npm install --save js-cookie

2、js-cookie的使用：

安裝好js-cookie插件后，在我們需要處理cookie的地方，簡(jiǎn)單的通過(guò)import引入就可以使用了

import Cookies from 'js-cookie'

3、js-cookie的増、查、刪

添加cookie

// 創(chuàng)建一個(gè)名稱為name，對(duì)應(yīng)值為value的cookie，由于沒(méi)有設(shè)置失效時(shí)間，默認(rèn)失效時(shí)間為該網(wǎng)站關(guān)閉時(shí) Cookies.set(name, value)// 創(chuàng)建一個(gè)有效時(shí)間為7天的cookie Cookies.set(name, value, { expires: 7 })// 創(chuàng)建一個(gè)帶有路徑的cookie Cookies.set(name, value, { path: '' })// 創(chuàng)建一個(gè)value為對(duì)象的cookie const obj = { name: 'ryan' } Cookies.set('user', obj)

需要注意的是，通過(guò)Cookies.set(name, value)添加cookie時(shí)，即使添加時(shí)的value值類型為number，添加后獲取到的value值的類型會(huì)被轉(zhuǎn)換成string類型。

cookie添加后，所有的請(qǐng)求接口都會(huì)自動(dòng)帶上cookie值，如果沒(méi)有設(shè)置cookie的失效時(shí)間，默認(rèn)就是該網(wǎng)站關(guān)閉時(shí)cookie失效。

獲取cookie

// 獲取指定名稱的cookie Cookies.get(name) // value// 獲取value為對(duì)象的cookie const obj = { name: 'ryan' } Cookies.set('user', obj) JSON.parse(Cookies.get('user'))// 獲取所有cookie Cookies.get()

獲取cookie時(shí)，如果cookie中不存在該名稱對(duì)應(yīng)的記錄，則會(huì)返回undefined。當(dāng)value為對(duì)象時(shí)，獲取的cookie需要通過(guò)JSON.parse()解析

刪除cookie

// 刪除指定名稱的cookie Cookies.remove(name) // value// 刪除帶有路徑的cookie Cookies.set(name, value, { path: '' }) Cookies.remove(name, { path: '' })

刪除帶有路徑path的cookie時(shí)，不能通過(guò)簡(jiǎn)單的Cookies.remove(name)進(jìn)行刪除，需要帶上路徑

參考文獻(xiàn)：

Cookie的使用（js-cookie插件）
js-cookie

總結(jié)

以上是生活随笔為你收集整理的js-cookie使用方法的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。