Making components talk with Vuex

Making components communicate in Vue can be done in several ways. In this recipe, you will build two components that communicate through a shared state in a structured manner, using Vuex.

Getting ready

Vuex is state management for Vue. We will talk about it more extensively in Chapter 10, Large Application Patters with Vuex. For now, we will try it out as an indirect means of communication between components. There are no particular skills you should have to carry out this recipe, but you should have at least an understanding of what the Flux pattern is, since Vuex is is inspired by Flux, Redux, and The Elm Architecture. You can find more information at https://facebook.github.io/flux/docs/overview.html.

We will use words such as Mutations and assume that you know what we are talking about. If you don't know and want a briefer nonetheless, you can take a look at Chapter 10, Large Application Patterns with Vuex.

 

How to do it...

We will centralize the state of...