Vue: computed и производное состояние
Значение, выводимое из реактивных данных, вычисляйте через computed без побочных эффектов.
Проверено Изменено
Плохо
const total = ref(0);
watch(items, () => { total.value = sum(items.value); });
Хорошо
import { computed } from 'vue';
const total = computed(() => sum(items.value));
Почему это важно
Отдельное изменяемое total может отстать от исходных данных. computed описывает зависимость напрямую.
Когда применять
Vue 3 Composition API. items — ref, sum — чистая функция. Watch остаётся подходящим инструментом для побочных действий; денежная арифметика требует точного представления.
Кто что делает
Человек
Определяет формулу итоговой суммы и округление.
AI-агент
Выносит чистое вычисление в computed и проверяет изменение элементов.
Пример применения
Корзина хранит позиции и количество. Итог вычисляется из них; сервер повторно рассчитывает стоимость перед оплатой.
Как проверить у себя
- Изменение количества обновляет итог.
- Вычисление не изменяет исходные данные.
Первоисточники
История изменений на GitHubДата проверки отражает содержательную сверку. Синхронизация сайта не обновляет её автоматически.