В чём различие между Options API и Composition API во Vue 3?

Composition API во Vue 3 — это новый способ организации и повторного использования логики компонентов, основанный на функциях, которые возвращают реактивные состояния и методы. В отличие от Options API, где логика разделена по опциям (data, methods, computed и т.д.), Composition API группирует связанную логику вместе, что улучшает читаемость и масштабируемость кода.

Ключевые отличия:

• Группировка логики: Composition API позволяет объединять связанную логику в функции (композиционные функции), а не разбивать её по опциям.
• Лучшее повторное использование: Логика легко выносится и переиспользуется между компонентами.
• Более явное управление реактивностью: Используются функции ref, reactive, computed для создания реактивных данных.

Пример использования Composition API:

import { ref, computed } from 'vue';

export default {
  setup() {
    const count = ref(0);
    const double = computed(() => count.value * 2);

    function increment() {
      count.value++;
    }

    return { count, double, increment };
  }
}