Из Vue 2 на Vue 3 – Migration Helper

[@sojey80135]

options-api намного лучше смотрится
напиши пожалуйста миграцию с v2 на v3 options-api

[@ildardev]

На сколько я понимаю, options-api в vue3 отличается иной обработкой хуков beforeCreate/created, и мелкими особенностями с реактивностью, отсутствием $set и т.д.?

Изменение названия хуков достаточно просто реализуемо, но вот мелкие особенности vue 3 пока у меня еще не отлавливаются и не обрабатываются

[@Fragster]

Это пока компоненты прям совсем простые. Чуть сложнее — и уже данные с методами мешаются. В composition api можно сгруппировать красиво, как-то так (выше код идет так же, как в возвращаемом объекте):

Спойлер

    return {
      tasks,
// отображение текущего задания
      currentTaskId,
      currentTaskIndex,
      currentTaskUrl,
      currentTask,
// переключение заданий
      unusedTasksCount,
      nextTask,
      selectTask,
      revokeUrl, // служебная функция-коллбэк после отображения нового задания
// добавление данных
      showDialog,
      dialogState,
      newTasks,
      appendTasks
    }

и да, вроде и немного, 150 строк компонент вместе с шаблоном, но уже код становится более локальным.

[@Fragster]

Примечание: во всех функциях компонента в options-api свойства доступны через this

кроме хука beforeRouteEnter