Как правильно установить состояние в магазине Vue 3 Pinia?

Question

При инициализации состояния в хранилище Pinia Vue 3 (API композиции) какой шаблон является более «правильным» или идиоматичным?

Опция 1:

        state: () => ({
    user: {},
  }),

Вариант 2:

        state: () => {
    return {
      user: {},
    };
  },

Вариант 3: Может быть, что-то еще?

Answer 1

Они одинаковые. Варианты 1 и 2 — это функции, которые возвращают объект. В стрелочных функциях {обозначает содержание функции (например, function x () {). Итак, если вы хотите вернуть объект (например, return {), вы бы использовали ({как вариант 1.

Ссылка: Расширенный синтаксис стрелочных функций

Answer 2

Для Vue 3 Composition API в Pinia правильный шаблон:

      export const useUserStore = defineStore('users', () => {
  const user = ref({});

  return { user };
})

Он называется «Магазин настроек».

В магазинах установки:

ref()становитсяstateхарактеристики

computed()становитсяgetters

function()становитсяactions

Дополнительная информация: https://pinia.vuejs.org/core-concepts/#setup-stores

Answer 3

Вариант 2. Это должна быть функция, возвращающая состояние. https://pinia.vuejs.org/core-concepts/state.html