В статье хочу поделиться опытом переписывания существующих классовых компонентов vue на новый синтаксис vue-composition-api.

Немного о нашем стеке.

Наше приложение написано на nuxt2 + vue-class-components + typescript. Из-за стека переезд на новый nuxt затруднился тем, что прежде чем сменить версию nuxt со 2 на 3 нам нужно переписать все наши компоненты. Тут нас очень спасла библиотека vuejs/composition-api и nuxtjs-composition-api

В статье разберем случаи от самых примитивных до менее примитивных.

Стоит сразу отметить, что в composition-api вся магия происходит внутри метода setup , который включает в себя 2 хука жизненного цикла vue компонента: beforeCreate и created
Помимо основных примеров я покажу как будет работать типизация в тех или иных кейсах.

* Все названия переменных вымышлены и не используются на продуктиве)

Поехали!

Читать далее

https://habr.com/ru/post/694960/?utm_source=habrahabr&utm_medium=rss&utm_campaign=694960