Каков best practice для общего функционала во Vue?

Доброго дня.
Допустим, у нас есть какой-то общий функционал, родительский компонент, который должен быть применен к другим компонентам. Например, спектр автономных компонентов, которые внутри сами забирают данные из определенного провайдера.

Для этого я вижу несколько вариантов:
- композиция (предпочтительно, но в мире JS нельзя сделать без костылей, так я бы в конструктор передал абстракцию)
- hoc (тоже весьма неплохо)
- наследование (не очень хорошо, снижает гибкость и вообще)
- миксины (аналог трейтов в php, по-моему, не самая удачная практика и по идее, миксины должны обкидывать помидорами за то, что там можно определить Lifecycle hooks и опции типа data, столько простора для индусов)

Собственно, вопрос, как лучше всего это сделать во Vue? В реакте сейчас я бы воспользовался хуками.
Заранее спасибо.
  • Вопрос задан
  • 2343 просмотра
Решения вопроса 2
Alex_Wells
@Alex_Wells
PHP/TS/Kotlin developer
В третей вьюхе будет композиция с помощью нового composition API. Говорят, что они схожи с реактовскими хуками.

Пока что можно юзать https://github.com/vuejs/composition-api - порт того же (или +- того же) АПИ на вторую версию. Важно понимать, что это НЕ полный порт, а лишь compat слой для легкого перехода на третюю версию.
Ответ написан
Heian
@Heian Автор вопроса
Ашот
В итоге сделал при помощи декораторов. Оказалось одним из самых удобных решений, особенно в контексте того. что я использую vue-class-property декоратор. От классического hoc'a выгодно отличается тем, что не создает под капотом новый компонент, а просто возвращает конструктор, который затем js сам применяет, где надо.

Выглядит при этом тоже очень красиво.
@Filterable // мой декоратор
@Component({
   // options
})
export default class extends Vue {
   // component logic
}
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
@Vaulter
Касательно провайдеров данных : их лучше вывести отдельно в сервисы, и передавать в свойства компонентов. Упрощённое подобие DI/RoC. Перед созданием vue app создаём все сервисы и передаём объектом, с полями равными именам сервисов и значениями равными самим объектам сервиса, в свойство App .
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
от 80 000 до 160 000 руб.
Zoon Москва
от 150 000 до 300 000 руб.
BS lab Минск
от 1 200 руб.
17 окт. 2019, в 22:21
250000 руб./за проект
17 окт. 2019, в 19:04
300 руб./в час
17 окт. 2019, в 19:01
500 руб./в час