[Vuejs]-The property update is only performed in the next update run

by

0👍

✅

There are a few things that you have to observe here:

  1. Vue doesn’t watch nested properties. To make it watch, use $set instead
  2. When you call this.resetCurrentName in updateName, you are resetting the changes made in vue instance. Since, mounted isn’t called on prop updates, it is causing the old this.name to be used instead of the new one. You can check the same in console.log s

Here is the link to working example: https://codesandbox.io/s/tender-payne-7ydb6

0👍

Here is the link of the updated sandbox https://codesandbox.io/s/pensive-ives-jex2e

   update() {
      this.$emit("update", this.currentName);
      this.resetCurrentName();
    }

Don’t reset the name on updating.

Leave a comment