当前位置:主页 > vue.js教程 > vue中设置、获取、删除cookie的方法

vue中怎样设置、获取、删除cookie

发布:2020-01-13 14:44:33 113


本站精选了一篇设置、获取、删除cookie相关的编程文章,网友桂元白根据主题投稿了本篇教程内容,涉及到vue、设置、获取、删除cookie、cookie、vue中设置、获取、删除cookie的方法相关内容,已被134网友关注,内容中涉及的知识点可以在下方直接下载获取。

vue中设置、获取、删除cookie的方法

1、在src目录下的access下新建一个cookie.js,

vue中设置、获取、删除cookie的方法

内容如下:

export function setCookie(c_name,value,expire) {
 var date=new Date()
 date.setSeconds(date.getSeconds()+expire)
 document.cookie=c_name+ "="+escape(value)+"; expires="+date.toGMTString()
 //console.log(document.cookie)
}
 
export function getCookie(c_name){
 if (document.cookie.length>0){
  let c_start=document.cookie.indexOf(c_name + "=")
  if (c_start!=-1){ 
   c_start=c_start + c_name.length+1 
   let c_end=document.cookie.indexOf(";",c_start)
   if (c_end==-1) c_end=document.cookie.length
    return unescape(document.cookie.substring(c_start,c_end))
   } 
  }
 return ""
}
 
export function delCookie(c_name){
 setCookie(c_name, "", -1)
}

2、在main.js中引入并且将cookie设置成vue的全局变量

vue中设置、获取、删除cookie的方法

3、这样,在登录或退出等页面上就可以调用$cookieStore这个全局变量来使用

// 将用户名存进cookie,第三个参数60为秒,意味着一分钟后cookie自动消失。一天为 86400 s
 this.$cookieStore.setCookie( 'username' ,this.username,60);

以上这篇vue中设置、获取、删除cookie的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持码农之家。


参考资料

相关文章

  • vue的keep-alive实例用法

    发布:2020-02-05

    在本篇文章里小编给大家整理的是关于vue的keep-alive用法技巧以及实例代码,需要的朋友们学习下。


  • Vue2 配置 Axios api 接口调用文件的具体步骤

    发布:2020-07-07

    本篇文章主要介绍了Vue2 配置 Axios api 接口调用文件的方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧


  • vue状态管理模式vuex知识点总结

    发布:2019-10-19

    本篇文章主要介绍了深入理解vue的状态管理模式vuex,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧


  • SpringBoot+Mybatis+Vue 实现商品模块的crud操作

    SpringBoot+Mybatis+Vue 实现商品模块的crud操作

    发布:2023-01-09

    给网友朋友们带来一篇关于SpringBoot的教程,这篇文章主要介绍了SpringBoot+Mybatis+Vue 实现商品模块的crud操作,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧


  • vue.js的vue-cli脚手架使用百度地图API的代码

    发布:2020-01-07

    今天小编就为大家分享一篇关于vue.js的vue-cli脚手架中使用百度地图API的实例,小编觉得内容挺不错的,现在分享给大家,具有很好的参考价值,需要的朋友一起跟随小编来看看吧


  • vue2.0中click点击当前li实现动态切换class实例方法

    发布:2020-05-25

    本篇文章主要介绍了vue2.0中click点击当前li实现动态切换class ,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧


  • vue项目打包后通过百度的BAE发布到网上流程步骤

    发布:2019-08-02

    这篇文章主要介绍了将vue的项目打包后通过百度的BAE发布到网上的流程,主要运用的技术是vue+express+git+百度的应用引擎BAE。需要的朋友可以参考下


  • 实例讲解如何在vue-loader中引入模板预处理器

    发布:2020-02-10

    这篇文章主要介绍了vue-loader中引入模板预处理器的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧


网友讨论