Чем Composition API отличается от Options API?
Компоненты
Options API группирует код по типам (data, methods, computed), Composition API — по логике, внутри функции setup.
Options API
export default {
data: () => ({ count: 0 }),
computed: { double() { return this.count * 2; } },
methods: { inc() { this.count += 1; } },
};Composition API (script setup)
<script setup>
import { ref, computed } from 'vue';
const count = ref(0);
const double = computed(() => count.value * 2);
const inc = () => { count.value += 1; };
</script>Преимущества Composition API
- Код одной функциональности лежит рядом, а не разбросан по секциям.
- Логику легко вынести в переиспользуемые функции (composables), а в Options API для этого были mixins с конфликтами имён.
- Лучшая поддержка TypeScript, нет
this. - Меньше размер бандла при минификации.
Совместимость
Оба стиля работают во Vue 3, их можно сочетать. Для новых проектов рекомендуют <script setup>.
Коротко для собеседования
Composition API группирует код по задачам и заменяет mixins composables. Options API проще для новичков и остаётся рабочим.