Which store properties to return

[jdnz]

I am transitioning to using setup stores in my project and I am confused about what the following statement in the documentation means:

Note you must return all state properties in setup stores for pinia to pick them up as state. In other words, you cannot have private state properties in stores.

What does it mean for pinia to 'pick them up as state'? More specifically I'm wondering if for some reason I have to return everything from the store, i.e. all the refs, computeds and functions for them to work correctly (trigger reactivity etc), even if they are only used internally in the store. Or do I only have to return things that I actually use outside the store?

[gegoune]

The latter. You don't need to return anything that you don't want to directly access outside your store.

[posva]

You need to return all ref(), reactive(), shallowReactive(). Anything that is state. You only need to return functions and computed that are used outside of the store.

[posva]

Yes, you have to return it but you can actually hide it like this. I do talk more about the problem within the course but the short version is: breaks SSR, devtools, and some plugins

[gunhaxxor]

Thanks for the quick reply. Good to know!

[paro-paro]

Hi @posva

The dealing with composables (setup stores) section from the docs shows a videoPlayer ref that is not returned from the store with a explicit we won't expose this element directly comment on top.

I am still wrapping my head around composition/composables, stores, etc, in vue 3 so any help to clarify this use case will really help.

Thanks!

[posva]

The ref of an HTMLElement is quite the edge case, so it's normal this can be confusing. I added a note to that page of the docs. I would recommend you not to focus too much on that specific example.

[paro-paro]

Thanks for the clarification! Must appreciated