VUE前端cookie简单操作实例分享-js教程-PHP中文网

首页

web前端

js教程

VUE前端cookie简单操作实例分享

小云云

Jan 15, 2018 am 11:17 AM

cookie ie 实例

本文主要为大家详细介绍了VUE前端cookie简单操作代码，具有一定的参考价值，感兴趣的小伙伴们可以参考一下，希望能帮助到大家。

如下是简单cookie操作，当前仅限前端实例，具体内容如下

要注意的有两点：

1、cookie内容存贮的名称
2、删除cookie是通过设置过期为过去时间实现的

<body>
<p id="app">
 <button @click="clearCookie()">
 清除cookie
 </button>
</p>
</body>
<script>
 let app = new Vue({
 el: "#app",
 data: {
 },
 created: function () {
  this.checkCookie();
 },
 methods: {
  //设置cookie
  setCookie: function (cname, cvalue, exdays) {
  var d = new Date();
  d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
  var expires = "expires=" + d.toUTCString();
  console.info(cname + "=" + cvalue + "; " + expires);
  document.cookie = cname + "=" + cvalue + "; " + expires;
  console.info(document.cookie);
  },
  //获取cookie
  getCookie: function (cname) {
  var name = cname + "=";
  var ca = document.cookie.split(&#39;;&#39;);
  for (var i = 0; i < ca.length; i++) {
   var c = ca[i];
   while (c.charAt(0) == &#39; &#39;) c = c.substring(1);
   if (c.indexOf(name) != -1) return c.substring(name.length, c.length);
  }
  return "";
  },
  //清除cookie
  clearCookie: function () {
  this.setCookie("username", "", -1);

  },
  checkCookie: function () {
  var user = this.getCookie("username");
  if (user != "") {
   alert("Welcome again " + user);
  } else {
   user = prompt("Please enter your name:", "");
   if (user != "" && user != null) {
   this.setCookie("username", user, 365);
   }
  }
  }
 }
 })
</script>

登录后复制

热AI工具

热工具

热门话题

Java教程

1666

CakePHP 教程

1425

Laravel 教程

1325

PHP教程

1272

C# 教程

1252

显示更多

Related knowledge

cookie是存在哪里 Dec 20, 2023 pm 03:07 PM

Cookie通常存储在浏览器的Cookie文件夹中的，浏览器中的Cookie文件通常以二进制或SQLite格式存储，如果直接打开Cookie文件，可能会看到一些乱码或无法读取的内容，因此最好使用浏览器提供的Cookie管理界面来查看和管理Cookie。

电脑上的cookie在哪里 Dec 22, 2023 pm 03:46 PM

电脑上的Cookie存储在浏览器的特定位置，具体位置取决于使用的浏览器和操作系统：1、Google Chrome，存储在C:\Users\YourUsername\AppData\Local\Google\Chrome\User Data\Default\Cookies中等等。

手机cookie在哪里 Dec 22, 2023 pm 03:40 PM

手机上的Cookie存储在移动设备的浏览器应用程序中：1、在iOS设备上，Cookie存储在Safari浏览器的Settings -> Safari -> Advanced -> Website Data中；2、在Android设备上，Cookie 存储在Chrome浏览器的Settings -> Site settings -> Cookies中等等。

win11无法使用ie11浏览器怎么办？(win11用不了ie浏览器) Feb 10, 2024 am 10:30 AM

越来越多的用户开始升级win11系统，由于每个用户的使用习惯不同，还是有不少用户在使用ie11浏览器，那么win11系统用不了ie浏览器，该怎么办呢？windows11还支持ie11吗？下面就来看看解决办法。win11无法使用ie11浏览器的解决方法1、首先右键开始菜单，选择“命令提示符（管理员）”打开。2、打开之后，直接输入“Netshwinsockreset”，回车确定。3、确定之后再输入“netshadvfirewallreset&rdqu

浏览器cookie的存储位置详解 Jan 19, 2024 am 09:15 AM

随着互联网的普及，我们使用浏览器进行上网已经成为一种生活方式。在日常使用浏览器过程中，我们经常会遇到需要输入账号密码的情况，如网购、社交、邮件等。这些信息需要浏览器记录下来，以便于下次访问时不需要再次输入，这时候Cookie就派上了用场。什么是Cookie？Cookie是指由服务器端发送到用户浏览器上并存储在本地的一种小型数据文件，它包含了一些网站的用户行为

document.cookie获取不到怎么解决 Nov 23, 2023 am 10:02 AM

document.cookie获取不到的解决办法：1、浏览器的隐私设置；2、Same-origin policy；3、HTTPOnly Cookie；4、JavaScript代码错误；5、Cookie不存在或过期；6、跨域问题；7、查看器模式；8、服务器问题；9、JavaScript执行时机；10、检查 console log等。

如何查找浏览器中的cookie Jan 19, 2024 am 09:46 AM

在日常使用计算机与互联网的过程中，我们经常会接触到cookie。cookie是一种小型的文本文件，它保存了我们在网站上的访问记录、偏好设置和其他信息。这些信息可以被网站使用，以便更好地为我们提供服务。但是有时候，我们需要查找cookie的信息，来找到我们要的内容。那么我们该如何在浏览器中查找cookie呢？首先，我们需要了解cookie的存在位置。在浏览器中

Cookie设置的常见问题及解决方案 Jan 19, 2024 am 09:08 AM

Cookie设置的常见问题及解决方案，需要具体代码示例随着互联网的发展，Cookie作为一种最常见的常规技术，已经广泛应用于网站和应用程序中。Cookie，简单来说，是一种存储在用户计算机上的数据文件，可用于存储用户在网站上的信息，包括登录名、购物车内容、网站首选项等等。Cookie对于开发人员来说是一种必不可少的工具，但与此同时，Cookie设置常常会遇到

See all articles

VUE前端cookie简单操作实例分享

热AI工具

Undresser.AI Undress

AI Clothes Remover

Undress AI Tool

Clothoff.io

Video Face Swap

热门文章

热工具

记事本++7.3.1

SublimeText3汉化版

禅工作室 13.0.1

Dreamweaver CS6

SublimeText3 Mac版

热门话题