转载:https://www.cnblogs.com/xiangsj/p/9030648.html

vue 中直接操作 cookie

以下3种操作方式

set: function (name, value, days) {

    var d = new Date;

    d.setTime(d.getTime() + 24*60*60*1000*days);

    window.document.cookie = name + "=" + value + ";path=/;expires=" + d.toGMTString();

},

get: function (name) {

    var v = window.document.cookie.match('(^|;) ?' + name + '=([^;]*)(;|$)');

    return v ? v[2] : null;

},

delete: function (name) {

    this.set(name, '', -1);

}

使用 js-cookie 工具:(比较方便,推荐使用)

工具地址:https://www.npmjs.com/package/js-cookie

//安装
cnpm i js-cookie
//引入
import Cookies from 'js-cookie'

//使用
    

具体使用见以下:

Basic Usage

Create a cookie, valid across the entire site:

Cookies.set('name', 'value');
Create a cookie that expires 7 days from now, valid across the entire site: Cookies.set('name', 'value', { expires: 7 });
Create an expiring cookie, valid to the path of the current page: Cookies.set('name', 'value', { expires: 7, path: '' });
Read cookie: Cookies.get('name'); // => 'value'
Cookies.get('nothing'); // => undefined
Read all visible cookies: Cookies.get(); // => { name: 'value' }
Delete cookie: Cookies.remove('name');
Delete a cookie valid to the path of the current page: Cookies.set('name', 'value', { path: '' });
Cookies.remove('name'); // fail!
Cookies.remove('name', { path: '' }); // removed!
IMPORTANT! when deleting a cookie, you must pass the exact same path and domain attributes that was used to set the cookie, unless you're relying on the default attributes. Note: Removing unexisting cookie does not raise any exception nor return any value

vue 中 直接操作 cookie 及 如何使用工具 js-cookie的更多相关文章

  1. 018——VUE中v-for操作对象与数值

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  2. vue中操作Dom节点的方法

    1.vue中ref操作dom节点 <template> <div id="app"> <div </div> <button @cl ...

  3. vue中的input使用e.target.value赋值的问题

    很久不写博客了... vue中对表单的处理,相对原生js,增加了一个双向绑定的语法糖:v-model.官方文档里有一段: v-model 会忽略所有表单元素的 value.checked.select ...

  4. Vue 中的 ref $refs

    ref 被用来给DOM元素或子组件注册引用信息.引用信息会根据父组件的 $refs 对象进行注册.如果在普通的DOM元素上使用,引用信息就是元素; 如果用在子组件上,引用信息就是组件实例 注意:只要想 ...

  5. vue中的数据监听以及数据交互

    现在我们来看一下vue中的数据监听事件$watch, js代码: new Vue({ el:"#div", data:{ arr:[,,] } }).$watch("ar ...

  6. vue中的锚链接跳转问题

    在vue中的锚链接和普通的html不同,关于vue中的锚链接可以参考vue 中的  scrollBehavior 滚动行为. 在router.js中 //创建 router 实例 const rout ...

  7. Vue中如何插入m3u8格式视频,3分钟学会!

    ​        大家都知道video只支持ogg.webm.MP4格式,但是要是m3u8格式的视频怎么办?最近遇到这个问题在网上找了好多办法都不行,最后找到video.js后才完美解决,所以决定写一 ...

  8. JS Cookie丢失问题

    JS Cookie丢失问题 前些天有人问我vue中使用proxy发送请求,为什么请求时cookie丢失,首先说一下我对cookie的理解: 1.cookie在正常情况下是会在每次请求时自动携带, 2. ...

  9. jquery.cookie中的操作

    http://w3school.com.cn/js/js_cookies.asp jquery.cookie中的操作: jquery.cookie.js是一个基于jquery的插件,点击下载! 创建一 ...

随机推荐

  1. 使用python函数持续监控电脑cpu使用率、内存、c盘使用率等

    方法一: # import time 导入time模块 # import psutil 导入psutil模块 # def func(): # while True: ------->持续监控得w ...

  2. myeclipse在过时的环境下部署项目出现的问题

    开发环境 操作系统:xp sp3 2002 (ps:客户公司环境只有这个老古董) 开发工具:myeclipse2014  32位 jdk: 1.7_49    32位 DB:DB2  9.1  32位 ...

  3. 常用LINUX命令汇总

    一.基本命令bash Bash(GNU Bourne-Again Shell)是许多Linux平台的内定Shellpwd 查看当前所在目录ls 查看目录内所有文件cd 进入目录cd .. 返回上一层p ...

  4. 容器化部署Cassandra高可用集群

    前提: 三台装有docker的虚拟机,这里用VM1,VM2,VM3表达(当然生产环境要用三个独立物理机,否则无高可用可言),装docker可参见Ubuntu离线安装docker. 开始部署: 部署图 ...

  5. 基于KMP算法的字符串模式匹配问题

    基于KMP算法的字符匹配问题 反正整个清明都在纠结这玩意...差点我以为下个清明要给自己过了. 至于大体的理解,我就不再多说了(还要画图多麻烦鸭),我参考了以下两个博客,写的真的不错,我放了超链接,点 ...

  6. ASP.NET MVC 3 Application Upgrader

    ASP.NET MVC 3 Application Upgrader: http://aspnet.codeplex.com/releases/view/59008

  7. docker:学习笔记

    docker run -itd --net=none 22565cef72c2 /usr/sbin/sshd -Dpipework br0 5a3e7bab4c5c5260a93e153aa7fec3 ...

  8. matlab-双摆仿真

    在物理学和数学中,在动力系统领域,双摆是一个摆锤,另一个摆锤连接在其末端,是一个简单的物理系统,具有丰富的动态特性,对初始条件具有很强的敏感性.双摆的运动由一组耦合的常微分方程控制并且是混沌的. 由于 ...

  9. Sublime Text3使用Package Control 报错There Are No Packages Available For Installation

    转 http://blog.csdn.net/feilong_csdn/article/details/67638660 在使用sublime时,有时候我们希望将代码复制出来后仍然是高亮显示,这样我们 ...

  10. Maven 错误:Failed to execute goal org.apache.maven.plugins:maven-compiler-plugin:3.1:compile (default-compile) on project appservice-common: Fatal error compiling: 无效的目标发行版: 1.8

    通过IDEA 提供的面板 执行package 或者 install 没有错误,但是cmd terminal 窗口就不行!出现: Maven 错误:Failed to execute goal org. ...