How to get the old value when on change event with Vue.js?

Sometimes, we want to get the old value when on change event with Vue.js.

In this article, we’ll look at how to get the old value when on change event with Vue.js.

How to get old value when on change event with Vue.js?

To get the old value when on change event with Vue.js, we can get the value from the 2nd parameter of the watcher.

For instance, we write

<script>
//...
export default {
  watch: {
    clonedItems: {
      deep: true,
      handler(newVal, oldVal) {
        console.log(JSON.stringify(newVal));
        console.log(JSON.stringify(oldVal));
      },
    },
  },
  //...
};
</script>

to get the old value of the clonedItems reactive property from the oldVal parameter.

Conclusion

To get the old value when on change event with Vue.js, we can get the value from the 2nd parameter of the watcher.