[Vuejs]-Vue2 property passed to vue3 built web component

by

1👍

This is the normal behaviour of props in Vue 2

They don’t "watch" down to deeper levels, by default.

Two solutions in Vue 2 from the docs: https://vuejs.org/guide/essentials/watchers.html#deep-watchers

1. Explicitly watch particular properties

watch: {
    'some.nested.key'(newValue) {
      // ...
    }
}

2. Deep-watch the entire prop

export default {
  watch: {
    someObject: {
      handler(newValue, oldValue) {
        // Note: `newValue` will be equal to `oldValue` here
        // on nested mutations as long as the object itself
        // hasn't been replaced.
      },
      deep: true
    }
  }
}

See below for @yoduh’s excellent point about Vue 3 composition API doing deep watching by default.

👤ProfDFrancis

Leave a comment