vs vuex

[Centaur]

What is the difference between this library and vuex? and what is the advantage?

[cklmercer]

Vuex is much more full featured. If you have a large scale, complex project then Vuex is probably the way to go, as it offers many excellent benefits that you won't find here. If all you need is to share reactive data between components, you'll find vue-stash much less cumbersome.

[cklmercer]

Not sure if this issue should be closed or not. I'm more than willing to have this discussion, however I don't see this as an actual issue.

[cklmercer]

Vuex requires you to use actions and mutators to interact with your store/state. This adds extra complexity, however this also gives you much more fine grained control over your application's state (including the ability to recreate particular states and time travel backwards to previous states). Vue Stash on the other hand is very simple and lightweight, but leaves it up to the developer to know exactly what's happening to their application's state.

[Centaur]

Thanks for the explanation. My original question answered. But why not just pass the store in props whereever needed?
BTW, I have seen some projects using label to categorize issues. Perhaps you can label this one as "FAQ".

[cklmercer]

There's a few reason why I would use vue-stash instead of just passing around a store prop.

The first is that passing the same props over and over gets tedious. It also gets harder to keep up with what's going on the further down the chain you pass the same prop.

Another reason would be that vue-stash allows you to declare all of your application's "global" state in a single store (even if that store is comprised of multiple files). This brings forth a few benefits, namely that it makes it easy to keep up with the key data that is being passed around in your application. (This is great for on-boarding additional developers.)

That said, the props option definitely still has it place. vue-stash is by no means a replacement for the props option. While there is some overlap in their purpose, vue-stash is much better suited for sharing data between components that aren't necessary connected via a direct parent <--> child relationship.

For example, you may have a "User Profile" component which contains a "User Card" and a "Update Form". Well, the "Update Form" and "Card" are siblings which both rely on the "User Profile" component for their props, but when the "Update Form" changes you want the "Card" to change in sync. To do this with just props would require you to fire an event and catch that event. vue-stash makes this trivial.

Kind of a long winded explanation, but hopefully it makes sense. .

[xhh2a]

The short answer is it boils down to what type of application you are building and how confident you are in understanding the state flow. If you are making what are essentially form inputs with a single source of truth, need to share some global data, and don't have complicated race conditions then vue-stash is the way to go. If you are making the next facebook messenger app or you aren't confident in managing a single source of truth then vuex is the solution.

As to why you would want to use it versus props, I find props doesn't work in semi-complex situations (computed property at parent level that depends on child A's computed property that isn't available until post mount as it depends on a jquery plugin passing to child B. Also doesn't work when trying to use v-model or trying to use watchers). It's also much neater in code.

I wrote a long rant about why vuex/flux and is awful but I'll leave that unsaid.

[theosherman]

I want to apologize ahead of time if the above discussion already answers my question. I am struggling to understand what vue-stash has over using vuex besides being a little less hefty. Take the following as an example:

export default new Vuex.Store({ state: { message: 'hello world' } })

I now have access to this inside any component using $store.state.message. Very similarly vue-stash I think would be:

export default { message: 'hello world' }

And then I can access $store.message.

Aside from the extra level of depth of putting data inside the state object. Vuex appears to have the same functionality as vue-stash if I'm not following the best practices by using actions/mutation. Am I missing anything? I don't quite follow the passing around a prop concept. Unless I'm misunderstanding that as well, why pass anything through props when this.$store is conveniently accessible inside any component?

[cklmercer]

vue-stash does not offer any features/functionality not already offered by vuex.

vue-stash is strictly meant to be a more approachable, light-weight alternative to vuex IF all you need is a global store.

[theosherman]

Ok. This makes sense. I definitely agree that it's more approachable and light-weight. Thank you.