parent: в него поступает items (он в watch)
2) item-list (ребенок parent) ему передается из parent: items_filtered (тоже в watch)
3) item (ребенок item-list) ему передается item
item: {
settings: {
closed: false;
}
}
в компоненте самом дочернем item по кнопке идет $emit('close', item) в item-list компонент.
В item-list функция обработчик onClick обращается к this.$root.items самому верхнему уровню находит там этот item в списке и меняет у него свойство closed: true.
Вся цепочка получает новый items из родителя с измененным свойство но при этом дочерние компоненты не перерендериваются. В самом дочернем компоненте item я обращаюсь в темплете к свойство item.settings.closed. Шо за нахрен?
Когда собрал половину антипаттернов в коде из трех компонентов)
1) он же и так реактивен и наблюдается 2) тоже самое 3) ненужно обращаться к родителю, это плохо.
Обсуждают сегодня