Как правильно использовать Vuex в проекте TypeScript Vue?


Как правильно использовать Vuex в проекте TypeScript Vue?

21.09.2020 07:01:58 Просмотров 2 Источник

В настоящее время я изучаю Vue, Vuex и TypeScript и должен сказать, что я немного запутался в том, как правильно настроить магазин Vuex. Документация вообще не охватывает реализацию TypeScript (у меня такое чувство, что в документации вообще отсутствуют фундаментальные примеры TypeScript?) что заставило меня (опять!) ищите решения на других страницах вне официальной документации (чего имхо не должно происходить, если новая технология изучается непосредственно через официальные ресурсы, так как она должна содержать всю информацию, необходимую для того, чтобы технология работала, не так ли?!).

Поэтому, когда я искал решения во всемирной паутине, я наткнулся на следующие паттерны:

  1. На bezkoder.com они используют декораторы из vuex-module-decorators для определения модулей хранилища Vuex как классов. Затем они снова используют декораторы, но на этот раз из vuex-class, чтобы получить доступ к соответствующим состояниям, мутациям и действиям из своих компонентов Vue. Это решение кажется очень "типографским", поскольку они используют классы и декораторы, как в официальной документации Vue TypeScript.

  2. На itnext.io (а Medium.com сайт) они используют так называемый "прямой магазин" с direct-vuex. Здесь они определяют само хранилище более "Яваскриптивным" способом, поскольку все состояния, мутации и действия передаются экземпляру хранилища как простые объекты.

  3. На dev.to и codeburst.io (еще один Medium.com сайт) они используют простые функции TypeScript для создания своего магазина. Поэтому они устанавливают множество констант enums и strings и определяют несколько interfaces в куче различных файлов, которые затем все экспортируются и импортируются снова в индексный файл каждого модуля, который затем создает соответствующий модуль Vuex. Это решение каким-то образом представляет собой смесь решения "TypeScripty" и "JavaScripty". Похоже, что этот метод создает самый шаблонный код.

Так что теперь, как новичок в Vue, я немного запутался, и у меня есть следующие вопросы:

  • Какой метод (1, 2 или 3 или, может быть, есть другой?) должен ли я предпочесть и почему? Каковы преимущества и недостатки этих методов? (Я искал сравнение различных подходов, но ничего не нашел.)
  • Должен ли я использовать плагины, которые не поддерживаются официальной командой Vue? Как я могу быть уверен, что эти плагины будут обновлены для работы с будущими выпусками Vue? (Например, в репо GitHub от vuex-module-decorators автор прямо говорит, что плагин-это всего лишь его побочный проект, что заставляет меня сомневаться в том, что плагин получит долгосрочные обновления.)
  • Почему об этом ничего нет в официальной документации? Почему в официальной документации так мало примеров машинописи? Есть ли место,где я могу найти надежный пример машинописного текста и решения для наиболее распространенных сценариев?
У вопроса есть решение - Посмотреть?

Ответы - Как правильно использовать Vuex в проекте TypeScript Vue? / What's the right way to use Vuex in a TypeScript Vue project?

Является ответом!
Aarree

21.09.2020 09:25:57

я не имею права комментировать, поэтому мне нужно ответить, но я также не могу ответить на все ваши вопросы... Я был в похожей ситуации. И теперь я использую Vuex-модуль-декораторы. Это кажется, как вы написали, очень типизированным, и настройка была довольно простой,использование тоже.

Так как мне приходится довольно часто обновлять свой код и в конце концов обновлять Vue.js и т. д... Я рискнул использовать эту (большую) зависимость, зная, что в какой-то момент мне, возможно, придется перестроить свои вещи. Но использование Vuex-модулей-декораторов отнимало у меня много времени и почти никогда не доставляло мне никаких проблем. Я не знаю других решений, но это кажется мне очень естественным для vue и typescript.

Я надеюсь, что это поможет

С уважением

Помочь в развитии проекта:
Закрыть X