[Vuejs]-Vuex best practices for working with additional classes: import into view or only in the Store?

1đź‘Ť

âś…

There’s no penalty for importing the same module multiple times throughout your project, the top-level code in that module will only be executed once.

I don’t think there’s a right or wrong answer to your question (it may get closed for being “opinion-based”).

  • Every time you import a module, it becomes a direct dependency of the importing module. This may make unit testing more difficult – how can you cleanly mock the imported module? (Certainly there are ways to do this, I’m just playing devil’s advocate.)
  • When you expose the service class directly on the component instance like you have, then the service class becomes dependent on Vue now because the data properties it exposes need to be reactive for it to be used within the template like that. Vue will make all the properties on the class reactive now. The class implementation also needs to be aware that this will happen and it must comply with Vue’s reactivity limitations when it mutates its own data.
  • For something simple like getting the current user, to me that seems more appropriate to store in Vuex instead of requiring every module import auth.service.
  • Try to maintain only a single “source of truth”, don’t share the ownership of data around because it becomes difficult to maintain.
👤Decade Moon

Leave a comment