Using Vuex4 With Vue3 And Ionic Framework

Using Vuex4 With Vue3 And Ionic Framework

A simple introduction to using vuex 4 for state management in vuejs version 3 with ionic framework

We cover two specific scenarios when using a simple count store


Thanks for the video, when I started my latest ionic project it was my first one on Vue 3, and I couldn’t figure out how to get vuex working. I think they key was finding that RC version repo.

However, I soon learned that due to the composition api, and ref/reactive specifically, I don’t really have any use for vuex anymore. A plain old ts/js function/class can have reactive properties that cause the view to rerender when they change, and i can keep those function/classes specific to each feature, rather than one giant central store. Would you happen to know the use case for vuex now that we have the composition api? Curious what your thoughts are.

I think that there are two camps on this - some people think it is pointless to use vuex some people say they still need it. I don’t see much benefit for it, vuex, without the developer tools at this point. Yes you can solve most of the state challenges using composition, but IMHO on larger projects without strict architectural guidelines things can get crazy real fast

I guess the key there is “without architectural guidelines”, although I’d argue that things will get crazy no matter what if you are lacking those.

In general, the more I can keep my code focused on a certain feature, the better organized it is and the easier it is to work on. The freedom of composition api allows that, sharing things within a feature, rather than a large global state.

And I really love it, I have data services that fetch and save data from/to my api, and they just update a ref property. Any component that needs to use it, just imports that ref. That’s it. It’s kind of magic. Then all my work is organized by feature, as it should be.

I know exactly where to find anything I want, and my business logic is still shared. It’s really nice.

I do think though, vuex’s more robust change tracking could be good for some things.

like I said it is purely an opinion, BTW there is really “no large state” when using namespaces in vuex state management. And vuex forces you into a pattern of actions, mutations, and payloads which is different from composables that can be structured anyway they developer/developers on the project decide to structure with

Every few years something new and shiny comes along, and it doesn’t necessarily mean that the old is old, there is plenty of documentation, patterns, and example to draw from when using vuex and I still personally believe that the tooling and is clearly a competitive advantage over composable