前端:Vue中使用JS-Cookie

在我们构建Vue站点时候,可能需要使用 cookie 来记录用户信息或者偏好设置,我们可以引入第三方库

GitHub - js-cookie/js-cookie: A simple, lightweight JavaScript API for handling browser cookies

来方便地操作 cookie。接下来我们就来一步一步地实现在 Vue  中使用 JS-Cookie 来操作 cookie。

1. 安装JS-Cookie 

首先,在命令行中使用 npm 或 yarn 安装 JS-Cookie:

npm install js-cookie
# 或
yarn add js-cookie
2. 引入JS-Cookie

在需要使用 cookie 的组件中,引入

import Cookies from 'js-cookie'
3. 设置cookie
export const setCookie = Cookies.set.bind(Cookies)
export const removeCookie = Cookies.remove.bind(Cookies)
export const getCookie = Cookies.get.bind(Cookies)

使用的时候调用即可 

import { cookie } from '@/global/cookie'
const store = cookie()
store.setCookie()
 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/744683.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

算法训练营day19--530.二叉搜索树的最小绝对差+501.二叉搜索树中的众数+236. 二叉树的最近公共祖先

一、530.二叉搜索树的最小绝对差 题目链接:https://leetcode.cn/problems/minimum-absolute-difference-in-bst/ 文章讲解:https://programmercarl.com/0530.%E4%BA%8C%E5%8F%89%E6%90%9C%E7%B4%A2%E6%A0%91%E7%9A%84%E6%9C%80%E5%B0%8F%E7%BB%9D%E5%AF…

基于KNN的旋转机械故障诊断(MATLAB)

KNN算法又称K-近邻算法,其主要思想是:对于要分类的样本按照一定的相似性度量方法寻找与之最近的K个邻居,计算这K个邻居中类别出现次数最多的那个类作为该样本所属类。其算法步骤如下。 (1)计算待分类样本与训练集中各个数据之间的距离。 (2…

React 19 新特性集合

前言:https://juejin.cn/post/7337207433868197915 新 React 版本信息 伴随 React v19 Beta 的发布,React v18.3 也一并发布。 React v18.3相比最后一个 React v18 的版本 v18.2 ,v18.3 添加了一些警告提示,便于尽早发现问题&a…

数学建模--Matlab操作与运算

目录 1.点运算 2.文件介绍 (1)文件分类 (2)温度转换 (2)函数调用 (3)建模经验 (4)注意事项 (5)多个返回值情况 (6…

离线部署OpenIM

目录 1.提取相关安装包和镜像 2.安装docker和docker-compose 3.依次导入镜像 4.解压安装包 5.执行安装命令 6.PC Web 验证 7.开放端口 7.1IM 端口 7.2Chat 端口 7.3 PC Web 及管理后台前端资源端口 “如果您在解决类似问题时也遇到了困难,希望我的经验分享…

将深度相机的实时三维坐标数据保存为excel文档(Python+Pyrealsense2+YOLOv8)

一、如何将数据保存为excel文档 1.excel文件库与相关使用 (1)导入相应的excel文件库,导入前先要进行pip安装,pip install xlwt import xlwt # 导入用于创建和写入Excel文件的库 (2) 建立一个excel文档,并在第0行写…

Python | Leetcode Python题解之第198题打家劫舍

题目: 题解: class Solution:def rob(self, nums: List[int]) -> int:if not nums:return 0size len(nums)if size 1:return nums[0]first, second nums[0], max(nums[0], nums[1])for i in range(2, size):first, second second, max(first nu…

读AI新生:破解人机共存密码笔记12人工智能辩论

1. 言论 1.1. 对一个人终身职业的威胁,可能会使一个非常聪明的、通常很有思想的人说出一些话,但在进一步分析后,他们很可能希望收回这些话 1.2. 电子计算器在算术方面是“超人”,但是计算器并没有接管世界,因此&…

IMX6ULL SD卡启动uboot+kernel+rootfs

目录 1. 背景说明 2.SD卡启动 2.1准备条件 2.2 对SD卡分区格式化 2.3 制作sd卡镜像 3.效果测试 1. 背景说明 网络上绝大数教程,教大家把uboot烧录到SD卡,然后uboot启动后,通过TFTP下载kernel和设备树,然后通过nfs挂载文件系…

laravel的日志使用说明

文章目录 了解系统的默认支持多个通道时它们的关系如何使用驱动 了解系统的默认支持 Laravel 日志基于「 通道 」和 「 驱动 」的。那么这个通道是干嘛的?驱动又是干嘛的? 通道 : 1.它表示了某种日志格式化的方式(或可理解为某个…

理解CNN模型如何学习

深度学习模型常常被认为是不可解释的。但是人们正在探索不同的技术来解释这些模型内发生了什么。对于图像,由卷积神经网络学习的特征是可解释的。我们将探索两种流行的技术来理解卷积神经网络。 可视化中间层的输出 可视化中间层的输出将有助于我们理解输入图像如何…

办公软件的答案?ONLYOFFICE 桌面应用编辑器会是最好用的 Office 软件?ONLYOFFICE 桌面编辑器使用初体验

文章目录 📋前言🎯什么是 ONLYOFFICE🎯 主要功能介绍及 8.1 新功能体验🎯 在线体验📝最后 📋前言 提到办公软件,大家最常用的可能就是微软的 Microsoft Office 和国产的 WPS Office。这两款软件…

使用API有效率地管理Dynadot域名,为文件夹中的域名进行域名停放

关于Dynadot Dynadot是通过ICANN认证的域名注册商,自2002年成立以来,服务于全球108个国家和地区的客户,为数以万计的客户提供简洁,优惠,安全的域名注册以及管理服务。 Dynadot平台操作教程索引(包括域名邮…

解锁高效办公:ONLYOFFICE新版本8.1功能揭秘与个人实战体验

文章目录 💯ONLYOFFICE 桌面编辑器 8.1 ✍1 新增功能介绍✍2 轻松编辑器PDF文件🍓2.1 PDF新增编辑器操作🍓2.2 PDF新增表单操作 ✍3 用幻灯片版式快速修改幻灯片✍4 无缝切换文档编辑、审阅和查看模式✍5 改进从右至左语言的支持 & 新的本…

C++——布隆过滤器

目录 布隆过滤器的提出 布隆过滤器的概念 布隆过滤器的基本原理和特点 布隆过滤器的实现 布隆过滤器的插入 布隆过滤器的查找 布隆过滤器的删除 布隆过滤器的优点 布隆过滤器的缺陷 布隆过滤器使用场景 布隆过滤器的提出 在注册账号设置昵称的时候,为了保证…

【已解决】SpringBoot图片更新需重启服务器才能显示

问题描述 1、更新头像,并跳转回列表页,发现显示不出来 2、但是前端获取用户头像的信息是在加载页面就会被调用的,同时前端也不存在所谓的缓存问题,因为没有动这部分代码。 但查看响应是能获得正确的信息(前端打印图片…

Docker 下载与安装以及配置

安装yum工具 yum install -y yum-ulits配置yum源 阿里云源 yum-config-manager --add-repo https://mirrors.aliyun.com/docker-ce/linux/centos/docker-ce.repo安装Docker 17.03后为两个版本: 社区版(Community Edition,缩写为 CE&#x…

内网一键部署k8s-kubeshpere,1.22.12版本

1.引言 本文档旨在指导读者在内网环境中部署 Kubernetes 集群。Kubernetes 是一种用于自动化容器化应用程序部署、扩展和管理的开源平台,其在云原生应用开发和部署中具有广泛的应用。然而,由于一些安全或网络限制,一些组织可能选择在内部网络…

【踩坑】修复循环设置os.environ[‘CUDA_VISIBLE_DEVICES‘]无效

转载请注明出处:小锋学长生活大爆炸[xfxuezhagn.cn] 如果本文帮助到了你,欢迎[点赞、收藏、关注]哦~ 问题示例 for gpus in [0, 1, 2, 3, 4, 5, 6, 7]:os.environ[CUDA_VISIBLE_DEVICES] gpusprint(torch.cuda.get_device_name(0)) 始终将使用第…

专业技能篇---计算机网络

文章目录 前言计算机网络基础一、网络分层模型 HTTP一、从输入URL到页面显示发生了什么?二、Http的状态码有哪些?三、 HTTP与HTTPS有什么区别?四、URI 和 URL 的区别是什么?五、Cookie和Session有什么区别?六、GET与POST WebSock…