Ответ
Vue использует реактивность на основе прокси (в Vue 3) или геттеров/сеттеров (Vue 2). При прямом переназначении объекта (obj = newObj) теряется реактивность, так как ссылка на объект меняется. Vue отслеживает только изменения свойств существующего реактивного объекта.
Для реактивного обновления:
- В Vue 3 используй
reactive()илиref() - В Vue 2 используй
Vue.set()илиthis.$set()
Пример:
// Vue 3
const state = reactive({ count: 0 })
// Реактивно:
state.count = 1
// НЕ реактивно:
state = { count: 1 }
// Vue 2
this.$set(this.obj, 'key', value)