Миграция на Vue 2.7
Здравствуйте! В данной статье я бы хотел поделиться своим опытом обновления проекта, написанного на Vue 2.6. Помимо обновления самого vue и компонентов, я на примерах покажу как мне удалось обновить другие зависимости проекта и адаптировать их для работы с Composition API, среди них: Vuex, BootstrapVue, AgGrid и VueFormGenerator.
История Composition API во Vue
React
Как ни странно, но данному нововведению мы обязаны React-у, а точнее представленной в 2018 году концепции react-хуков.
Создатель vue, Эван Ю о реакт хуках
Я никогда не трогал React, лишь бегло прочитал его документацию, поэтому не могу объективно высказаться об этой возможности библиотеки, однако почти все React-разработчики заявляют что хуки позволяют в значительной мере упростить разработку и создавать переиспользуемый код; более того функциональные компоненты с использованием хуков это уже стандарт разработки на React.
Vue 3
С выходом vue 3-ей версии, разработчикам стал доступен новый подход к созданию компонентов, схожий с функциональными компонентами реакта — Composition API: метод setup и <script setup> для использования в однофайловых компонентах.
Сравнивая composition API с options API, в качестве его преимуществ обычно перечисляют:
простота и лаконичность
возможность создавать переиспользуемые куски логики (вместо миксинов)
улучшенная поддержка TypeScrit
большая производительность (по заявлениям создателей)
Стоит также учесть и критические оценки такого подхода:
Источники
Composition API во Vue 3 — плюсы, минусы и опыт использования
Обзор Vue Composition API. Реальность оказалась сложнее
В целом можно заметить что все недостатки или опасения по поводу использования composition API упираются в опыт и знания разработчика: composition API предоставляет гораздо больше инструментов для работы с реактивностью, что естественно требует некоторых усилий для понимания и осторожности, особенно если разработчик привык к options или class API.
Vue 2.7
В июле 2022 года вышел релиз vue 2.7, в котором composition API было добавлено из коробки (ранее для этого требовалась библиотека @vue/composition-api), и добавлена возможность использовать