Common Vue.js Mistakes and How to Avoid Them

Destructuring Reactive Data

In this video, we learn why it’s not a good idea to de-structure reactive data defined with the reactive function. Instead you should:

  1. Reference the reactive object directly
  2. Define a computed prop (if you’re ok with the data being read only)
  3. Use toRefs

Finally, when creating your composables, definitely make sure you aren’t just returning a reactive object. Why? Because most Vue developers expect composables to be destructurable.