Обработка модульного подхода с пространством имен на PINIA, Vue3+Typescript

Question

обычно я использовал vuex с пространством имен. Но я решаю бросить vuex , потому что Пиня имеет VUE поддержки основной команды. Я думаю, это лучше для будущих разработок. Теперь я создаю магазин с модульным подходом, но не могу понять, как обрабатывать эту часть в проекте машинописного текста.

скажем, у меня есть user интерфейс.

      interface User {
  email: string,
  username: string,
}

export default User;

И в store/modules/state.ts Я вызываю Type и создаю пользовательское состояние.

      import User from "../../types/User"

export const state = () => {
  return {
    user: {} as User | null,
  };
}

И в store/modules/index.tsЯ должен импортировать государство. И сделать namespace: true затем экспортируйте его в defineStore() для магазина pinia.

      import {state} from "./state"

export default {
  namespace: true,
  state,
}

в store/index.ts

      import {defineStore} from "pinia"
import {data} from "./modules"

export const Store = defineStore(data)

хорошо, выше, часть пространства имен я использую способ vuex. Но каков правильный подход к пинии. Кроме того, геттеры и действия. Как следует их экспортировать и использовать.

Answer 1

Согласно официальным документам Pinia:

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

Итак, теперь вы должны думать о каждом модуле vuex как об отдельном хранилище pinia. Глядя на ваш пример, это может выглядеть так. создать файл в store/modules/index.tsи вставьте:

      import { defineStore } from "pinia";
import state from "store/modules/state.ts"; // Assuming that it's path to user state

export const useUserStore = defineStore('some/vuex/module/name', {
  state: state,
  getters: {
    // your getters here, check the Offical Pinia above
  },
  actions: {
    // your actions and mutations here, also check the offical Pinia Docs
  }
})

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