vue-cli中cookie的简单封装

青旅半醒 2024-04-18 15:43 2阅读 0赞

刚开始存储token的时候，存到了local里。后期应领导的要求，存到cookie里，因为可以设置过期时间。这里对cookie记录一下简单的封装。

首先建立一个cookie.js，可以跟main.js同级

//cookie的设置
    var setCookie=function (name,value,day){
      var strCookie="";
      //判断name和value是否存在
      if(name && value){
        strCookie=encodeURIComponent(name)+"="+encodeURIComponent(value)+";";
      }
      //判断时间
      if(typeof(day)=="number"){
        var date=new Date();
        date.setDate(date.getDate()+day)
        strCookie+="expires="+date.toUTCString()+";";
      }
    
      return document.cookie=strCookie;
    }
    
    
    //获取cookie
    var getCookie=function (name){
      var cookieStr=decodeURIComponent(document.cookie);
      var arr1=cookieStr.split(";")//[aa="xxx",bb="xxx"]
      for(var i=0;i<arr1.length;i++){
        var arr2=arr1[i].split("=");
        if(arr2[0].trim()===name){
          return arr2[1]
        }
      }
    }
    
    
    //删除cookie
    var delCookie=function (name){
      setCookie(name,1,-1);
    }
    
    
    //导出
    export {
      setCookie,
      getCookie,
      delCookie
    }

其次呢，在需要的页面直接先导入

import {setCookie,getCookie,delCookie} from '../../cookie.js'

最后，想用的时候直接用就可以了

setCookie("bbb","222",4);
    setCookie("ccc","333",2);
    console.log(getCookie("ccc"))
    delCookie("bbb")

发表评论取消回复

表情：

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

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

相关阅读

相关 vue-cli中cookie的简单封装

开始存储token的时候，存到了local里。后期应领导的要求，存到cookie里，因为可以设置过期时间。这里对cookie记录一下简单的封装。首先建立一个cooki...

青旅半醒/ 2024年04月18日 15:43/ 0 赞/ 3 阅读

相关快速部署vuecli3 vuecli搭建 vuecli

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

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

相关 js实现存储cookie获取cookie封装

//存储cookie 不设置时间为永久存储cookie function setCookie(cname, cvalue) { // var d

古城微笑少年丶/ 2022年12月19日 01:23/ 0 赞/ 92 阅读

相关 js-cookie封装获取cookie方法

先安装依赖 > npm i js-cookie 代码示例 import Cookies from 'js-cookie' const T

傷城~/ 2022年12月14日 08:49/ 0 赞/ 131 阅读

相关 asp.net中cookie的简单存取

在asp.net中cookie相当容易使用，Request和Response对象都提供了Cookies集合，要记住是从Response中存储，从Request中读取相应的coo

骑猪看日落/ 2022年09月18日 11:52/ 0 赞/ 87 阅读

相关 Cookie的简单使用

在JSP中，使用cookie，有以下几个步骤: 1.使用page指令导入类javax.servlet.http.cookie <%@ page import="javax.

￡神魔★判官ぃ/ 2022年09月18日 10:54/ 0 赞/ 83 阅读

相关 vuecli4中关闭Eslint

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

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

相关 vuecli4中配置服务器

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

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

相关 Cookie 的简单使用

cookie的使用，可以和RESTful 结合 > 读取已存 Cookie 或者设置新的 Cookie > Cookie 会限定域名，只能是本域名或者是父级域名，其

川长思鸟来/ 2022年05月19日 12:20/ 0 赞/ 115 阅读

相关 Java中Cookie的简单使用

向请求中添加cookie： //创建cookie对象，赋值key-value Cookie userCookie = new Cookie("

港控/mmm°/ 2022年03月20日 13:39/ 0 赞/ 246 阅读