Common Mistakes in Vue.js and How to Avoid Them
summary
Covers four concrete Vue mistakes and fixes: using index as key breaks components with internal state when array order changes — fix by using a unique id (and keys to force re-renders); treating browser APIs as reactive — use useLocalStorage (VueUse) or wrap values in refs; replacing a reactive object loses reactivity — prefer ref and mutate its contents instead of reassigning; mutating props directly — use the defineModel macro or clone objects (JSON.parse/JSON.stringify) and emit updates to the parent.
AI-written summary · about
chapters (5)
- 0:00Common Mistakes in Vue.js and How to Avoid Them
- 2:00Mistake 1
- 7:16Mistake 2
- 12:29Mistake 3
- 16:14Mistake 4
related talks
35mCommon Mistakes in Vue.js and How to Avoid Them
27mCommon Mistakes in Vue.js
31mCommon Mistakes in Vue and Nuxt and How to Avoid Them
32mVue.js 입문자가 실무에서 주의해야 할 5가지 특징
08mUnderstand the hard parts of Nuxt
24mVue js in Practice: Hybridizing Objects and Functions
29mTips & Tricks for your Vue 3 applications
20mDemystifying the Vue Lifecycle