Heim > Web-Frontend > js-Tutorial > Beispiel für eine einfache Bedienung des VUE-Front-End-Cookies zum Teilen

Beispiel für eine einfache Bedienung des VUE-Front-End-Cookies zum Teilen

小云云
Freigeben: 2018-01-15 11:17:58
Original
2530 Leute haben es durchsucht

In diesem Artikel wird hauptsächlich der einfache Operationscode des VUE-Front-Ends vorgestellt, der einen gewissen Referenzwert hat. Ich hoffe, er kann jedem helfen.

Das Folgende ist ein einfacher Cookie-Vorgang, der derzeit auf Front-End-Instanzen beschränkt ist. Der spezifische Inhalt ist wie folgt

Es sind zwei Punkte zu beachten:

1. Cookie-Inhalt Speichername
2. Das Löschen von Cookies erfolgt durch Festlegen des Ablaufdatums auf die vergangene Zeit


<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>
Nach dem Login kopieren

Verwandt Empfehlungen:

HTML5-Web-Cache und Anwendungs-Cache (Cookie, Sitzung)

Beispiel für jQuery kombiniert mit dem jQuery.cookie.js-Plug-in zur Implementierung von Skinning Funktion

JQuery-Implementierung der Skin-Änderungsfunktion basierend auf Cookies

Das obige ist der detaillierte Inhalt vonBeispiel für eine einfache Bedienung des VUE-Front-End-Cookies zum Teilen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage