What is the correct way of setting state on a Vue 3 Pinia store?

Question

When initializing state on a Vue 3 (composition API) Pinia store which pattern is more "correct" or idiomatic?

Option 1:

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

Option 2:

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

Option 3: Maybe something else?

Answer 1

They are the same. Option 1 and 2 are functions that returns an object. In arrow functions, the { stands for the content of the function (like function x () {). So if you want to return an object (like return {), you would use ({ as option 1 does.

Reference: Arrow functions advanced syntax