vue 中 直接操作 cookie 及 如何使用工具 js-cookie
转载: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的更多相关文章
- 018——VUE中v-for操作对象与数值
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- vue中操作Dom节点的方法
1.vue中ref操作dom节点 <template> <div id="app"> <div </div> <button @cl ...
- vue中的input使用e.target.value赋值的问题
很久不写博客了... vue中对表单的处理,相对原生js,增加了一个双向绑定的语法糖:v-model.官方文档里有一段: v-model 会忽略所有表单元素的 value.checked.select ...
- Vue 中的 ref $refs
ref 被用来给DOM元素或子组件注册引用信息.引用信息会根据父组件的 $refs 对象进行注册.如果在普通的DOM元素上使用,引用信息就是元素; 如果用在子组件上,引用信息就是组件实例 注意:只要想 ...
- vue中的数据监听以及数据交互
现在我们来看一下vue中的数据监听事件$watch, js代码: new Vue({ el:"#div", data:{ arr:[,,] } }).$watch("ar ...
- vue中的锚链接跳转问题
在vue中的锚链接和普通的html不同,关于vue中的锚链接可以参考vue 中的 scrollBehavior 滚动行为. 在router.js中 //创建 router 实例 const rout ...
- Vue中如何插入m3u8格式视频,3分钟学会!
大家都知道video只支持ogg.webm.MP4格式,但是要是m3u8格式的视频怎么办?最近遇到这个问题在网上找了好多办法都不行,最后找到video.js后才完美解决,所以决定写一 ...
- JS Cookie丢失问题
JS Cookie丢失问题 前些天有人问我vue中使用proxy发送请求,为什么请求时cookie丢失,首先说一下我对cookie的理解: 1.cookie在正常情况下是会在每次请求时自动携带, 2. ...
- jquery.cookie中的操作
http://w3school.com.cn/js/js_cookies.asp jquery.cookie中的操作: jquery.cookie.js是一个基于jquery的插件,点击下载! 创建一 ...
随机推荐
- react基础学习 二——生命周期
生命周期mount: mounting装载创建 update更新 unmounting卸载 错误捕获 注意点:生命周期函数的 作用,什么之后用 只有类式组件有生命周期,函数式组件没有生命周期 moun ...
- 2018-2019-2 网络对抗技术 20165304 Exp1 PC平台逆向破解(BOF实验)
1.实践目的 本次实践的对象是一个名为pwn1的linux可执行文件. 三个实践内容如下: 手工修改可执行文件,改变程序执行流程,直接跳转到getShell函数. 利用foo函数的Bof漏洞,构造一个 ...
- CSS设计中的错误大整理!
如果有人发明时间机器,那应该将这些错误纠正,不然可把前端程序猿们给还惨了.大家一起看看都有哪些CSS规则应该完善. (CSS 代码) white-space: nowrap 应该 white-spac ...
- Linux上安装jdk,mysql
1.准备工作 一台纯净的Linux系统需要先安装一些依赖才能安装jdk等 rpm: 本地添加安装程序:rpm -ivh 程序名 本地查看程序: rpm -qa 本地卸载程序: rpm -e --nod ...
- 使用spring-session共享springmvc项目的session
一.说在前面 spring mvc项目,使用nginx,tomcat部署. 之前没做session共享,而nginx采用sticky模块进行分发. 但发现有时不能正确地指向同一台服务器,从而导致ses ...
- ubuntu搭建svn服务器并htpp访问版本库并svn与web同步
Ubuntu搭建SVN服务器多版本库 1 介绍 Subversion是一个自由,开源的版本控制系统,这个版本库就像一个普通的文件服务器,不同的是,它可以记录每一次文件和目录的修改情况.这样就可 ...
- 正则简单操作cookie、url search
正则操作cookie.url getCookie function getCookie(key) { var cookies = window.document.cookie, reg = new R ...
- Django中ORM实际应用
1. Django中ORM的使用 1. 手动新建一个数据库 2. 告诉Django连接哪个数据库 settings.py里面配置数据库连接信息: # 数据库相关的配置项 DATABASES = { ' ...
- Spring.xml中配置注解context:annotation-config和context:component-scan简述
XML中context:annotation-config和context:component-scan简述 <context:annotation-config/> 中文意思:<上 ...
- Nginx配置反向代理服务器
首先,在阅读<深入理解Nginx模块>后,大体了解了配置反向代理服务器一些常见的配置.如下进行说明:” l Nginx worker进程个数 语法: worker_processes n ...