Что можешь сказать про computed и watch во Vue 3?

В Vue 3 computed и watch — это реактивные инструменты для работы с данными, но с разными целями.

• computed — это вычисляемые свойства, которые кэшируются и пересчитываются только тогда, когда изменяются их зависимости. Используются для вычисления значений на основе реактивных данных, при этом Vue оптимизирует производительность, избегая лишних вычислений.

  import { ref, computed } from 'vue';
  
  const count = ref(1);
  const double = computed(() => count.value * 2);
  

• watch — это наблюдатель, который следит за изменениями реактивных данных и выполняет побочные эффекты, например, асинхронные операции или вызовы API. В отличие от computed, watch не кэшируется и предназначен для реакций на изменения.

  import { ref, watch } from 'vue';
  
  const count = ref(1);
  watch(count, (newVal, oldVal) => {
    console.log(`count изменился с ${oldVal} на ${newVal}`);
  });
  

Итого, computed — для вычисления значений с кэшированием, watch — для реакции на изменения с выполнением побочных эффектов.