Using the Vuex Pattern in Contrast with Other Patterns Such as Redux

The final scenario we will look at is using the Vuex pattern. In this case, all state is held in a single store. Any updates to the state are dispatched to this store. Components read shared and/or global state from the store.

Vuex is both a state management pattern and a library implementation from the Vue.js core team. The pattern aims to alleviate issues found when global state is shared by different parts of the application. The state of the store cannot be directly manipulated. Mutations are used to update store state and, since store state is reactive, any consumers of the Vuex store will automatically update.

Vuex draws inspiration from previous work in the JavaScript state management space such as the Flux architecture, which popularized the concept of unidirectional data flow, and Redux, which is a single-store implementation of Flux.

Vuex is not just another Flux implementation. It is a Vue.js-specific...