javascript - 更新 Watch Vue.js 上的 cookie

Question

我目前正在实现cookie。 我有要设置的 cookie，并且该 cookie 最初有一个空对象。 一旦对象被填充，我就会看到对象正在更新，这是我想要更新我的 cookie 的地方，但是，它不会在 watch 上更新。 我将在下面放一份草稿。

   <template>
         <details @detailsCompleted="savedDetails"></details>
    </template>


      data() {
         return {
               obj:{}
         }
            },

    methods: {
    savedDetails: function(objectPassed) {
    this.obj = objectPassed;
    }
    }
     mounted: function() {
           this.obj = {};
            Cookies.set("name", JSON.stringify(this.obj), {expires: '1m'});
            Cookies.get("name");

        }

        watch: {
        obj: {
        handler: function(val){
        Cookies.set("name", JSON.stringify(val), {expires: '1m'});
         Cookies.get("name");

        }
    }

我可以看到cookies被初始化，并且有空的obj，但是，在 watch 上没有更新，我怎样才能实现这个？谢谢

Answer 1

只需像这样使用 saveDetails 方法更新 cookie

<template>
   <details @detailsCompleted="savedDetails"></details>
 </template>

 data() {
   return {
     obj:{}
    }
  },
  methods: {
    savedDetails: function(objectPassed) {
      this.obj = objectPassed;
      Cookies.set("name", JSON.stringify(objectPassed), {expires: '1m'});
      Cookies.get("name");
    }
  },
  mounted: function() {
    this.obj = {};
    Cookies.set("name", JSON.stringify(this.obj), {expires: '1m'});
    Cookies.get("name");
  }

编辑:

https://jsfiddle.net/k85o7bdq/

这是一个工作 fiddle 。

也许您正在尝试通过查看开发工具中的“应用程序”选项卡来确定 cookie 是否已更新？那里有一个小刷新按钮，更新 cookie 后尝试单击它。