Component Communication

and State Management

in Vue.js

Component A

Component B

Component A

Component B

Component A

Component B

Component C

Component B

Component A

Component B

Component C

Component A

Component B

Component C

Event Bus

Event Bus

An event bus implements the publisher/subscriber pattern. It can be used to decouple the components of an application so that a component can react to events fired from another component without them having direct dependencies with each other. They only need to know the event bus.

Every subscriber can subscribe to a specific event. A subscriber will be notified when the event it subscribes to is published on the event bus.

A publisher can publish events on the event bus when something happens.

Component A

Component B

Vuex

Vuex

Vuex is a state management pattern + library for Vue.js applications. It serves as a centralized store for all the components in an application, with rules ensuring that the state can only be mutated in a predictable fashion.

Mutations

Actions

 

State

 
 

Getters

 
 
 

Modules

 
 
 
 

Plugins

 
 
 
 

Component Binding Helpers

 
 
 
 

Namespace

 
 
 
 

Component Communication and State Management in Vue.js

By fadamakis

Component Communication and State Management in Vue.js

  • 21