CODEWITHSUNDEEP
javascriptvue.jsstorevue-componentvuex
Sina
Sina

Reputation: 1132

Sharing application store state

Im using Vue and Vuex in my application and I have some components. By the time passing I know I will probably have a few more which is gonna be a lot. So I have a problem with sharing the app state within all the components. So I'd like to know which way should I follow? Either passing the state to all the components no matter child or parent, or passing the state to a parent one that will be used in some of its child components and then passing the state to them as a property (however, I do need to import the mutations methods because props are not reactive)?

UPDATE:

Keep in mind though that if a component is going to be displayed or hidden and the conditional statement v-if is attached to the component custom tag, each time the entire component is going to be rendered again! But not if statement was only on some child tags in the component.

Thanks in advance.

Upvotes: 0

Views: 291

Answers (2)

Rashad Saleh
Rashad Saleh

Reputation: 2847

What you are asking is a false dilemma. From the official documentation:

By providing the store option to the root instance, the store will be injected into all child components of the root and will be available on them as this.$store.

(emphasis mine)

Which means that sharing the store between components no matter how deep in the component tree is handled for you automatically by vue and vuex.

Upvotes: 1

Marek Urbanowicz
Marek Urbanowicz

Reputation: 13684

It's quite opinion based question, but I would say it is much better way to use Vuex since the beginning if you know that your app can be developed into large scale.

Passing states from parent to child all the way etc is not good way, so it is better to use Vuex now and you will save a lot of time changing your app in the future when you would have no other way than vuex.

Upvotes: 1

Related Questions