vue-cli项目使用 js-cookie

我就是我 2024-04-19 10:53 1阅读 0赞

### js-cookie github地址 ###

https://github.com/js-cookie/js-cookie

### 使用方式 ###

npm install js-cookie --save

### 引入js-cookie ###

import Cookies from 'js-cookie'

### 使用js-cookie ###

##### 获取cookie对应的值 #####

import Cookies from 'js-cookie'
    // 获取对应名字的cookie
    Cookies.get('对应名字');

例如：  
开发者工具：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9tZW5waGlzLmJsb2cuY3Nkbi5uZXQ_size_16_color_FFFFFF_t_70]  
要获取该cookies的值，代码如下：

import Cookies from 'js-cookie'
    // 获取对应名字的cookie
    let name = Cookies.get('name'); 
    console.log(name); // testasnfdinasdfina sdf

##### 设置对应名称的cookies 及值 #####

import Cookies from 'js-cookie'
    // 设置对应名字的cookie
    Cookies.set('对应名字', '对应的值');

例如要设置 cookie的名字为 test 值为 1 代码如下：

import Cookies from 'js-cookie'
    // 设置对应名字的cookie
    Cookies.set('test', '1');

##### 删除对应名称的cookies #####

import Cookies from 'js-cookie'
    // 删除对应名字的cookie
    Cookies.remove('对应名字');

例如要设置 cookie的名字为 testDel 代码如下：

import Cookies from 'js-cookie'
    // 删除对应名字的cookie
    Cookies.remove('testDel');

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9tZW5waGlzLmJsb2cuY3Nkbi5uZXQ_size_16_color_FFFFFF_t_70]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/18/b237f24665bb41b2b05215aa33272116.png

发表评论取消回复

表情：

评论列表（有 0 条评论，1人围观）

还没有评论，来说两句吧...

相关阅读

相关 vueCli pwa模式增加

vue-cli2X或者vue-cli3X 文档见[官网][Link 1] 我们不用配置就可以跑起来，但是配置里面有些地方需要注意的而且不能乱改，自行看文档。配置常用的是

港控/mmm°/ 2023年07月18日 14:16/ 0 赞/ 95 阅读

相关 vuecli3 多页面配置

vuecli3 多页面配置项目结构 1. login文件配置（有配置路由） login文件目录 lo

落日映苍穹つ/ 2023年01月19日 03:24/ 0 赞/ 293 阅读

相关 vuecli4打包优化(Marksheng）

一、去除生产环境sourceMap sourceMap资源映射文件，存的是打包前后的代码位置，方便开发使用，这个占用相当一部分空间 module.exports

浅浅的花香味﹌/ 2022年12月27日 04:41/ 0 赞/ 268 阅读

相关 vuecli+elementUI+vue-router+vueX

引入element ui: 1.下载 npm i element-ui -S vue add element 2.在main.js中写入

忘是亡心i/ 2022年12月27日 01:29/ 0 赞/ 162 阅读

相关快速部署vuecli3 vuecli搭建 vuecli

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ub

本是古典何须时尚/ 2022年12月22日 11:07/ 0 赞/ 242 阅读

相关使用VueCLI脚手架创建项目

\\VueCLI脚手架创建项目安装脚手架 \[VueCLI官网\] (https://cli.vuejs.org/zh/guide/installatio

素颜马尾好姑娘i/ 2022年11月21日 09:58/ 0 赞/ 290 阅读

相关 VueCli4实现自适应

参考：[Vue-cli4项目自适应 - 简书][Vue-cli4_ -] > 在scss中/\no\/不生效，可以将px写为PX > px2rem-loader

悠悠/ 2022年09月11日 06:15/ 0 赞/ 153 阅读

相关 vuecli4中关闭Eslint

元气满满，直接干！如果在创建项目时选择了eslint，而你又无法驾驭它，噩梦就开始。各种报错，让你非常难受！这时我们就要关闭eslint，过程非常简单。 1. 在项目

「爱情、让人受尽委屈。」/ 2022年09月02日 00:45/ 0 赞/ 266 阅读

相关 vuecli4中配置服务器

元气满满，直接干！在使用vuecli4开发项目时，如果需要自己开发服务器测试项目，单独编写一个服务器，非常难受！这时，我们可以在vuecli4中直接进行服务器开发。过

女爷i/ 2022年09月02日 00:44/ 0 赞/ 205 阅读

相关 vuecli4中配置打包使用相对路径

元气满满，直接干！使用vuecli4进行项目打包时，默认使用的是根目录的方式，这样打包直接项目直接运行就是一个大白屏，非常难受！这时我们就需要在设置打包使用相对目录的方

╰半橙微兮°/ 2022年09月02日 00:44/ 0 赞/ 240 阅读