Чем computed отличается от watch и методов во Vue?
Реактивность
`computed` — кешируемое производное значение, `watch` — побочный эффект при изменении данных, метод — функция, которая вызывается каждый раз.
computed
const fullName = computed(() => `${first.value} ${last.value}`);- Пересчитывается, только когда изменились зависимости, иначе отдаёт кеш.
- Должен быть чистым: ничего не менять и не запрашивать.
watch
watch(userId, async (id) => {
user.value = await fetchUser(id); // побочный эффект: запрос
});Подходит для запросов, записи в localStorage, таймеров, реакции на изменение.
Метод
Выполняется при каждом вызове (в шаблоне при каждом рендере), кеша нет. Подходит для действий и обработчиков событий.
Выбор
Нужно вычислить новое значение из существующих — computed. Нужно что-то сделать при изменении — watch. Нужно выполнить действие по событию — метод.
Коротко для собеседования
computed — кеш вычисления без побочных эффектов, watch — реакция с эффектами, метод — вызов без кеша.