Vue.js what's the difference of $emit and $dispatch? Vue.js what's the difference of $emit and $dispatch? vue.js vue.js

Vue.js what's the difference of $emit and $dispatch?


No, You will not be able to replace $disptach with $emit everywhere. You can replace it, wherever you are using it for communication from child to parent, but for other cases, you may have to take some other approach.

From the documentation ( similar comments from Evan you in Upgrade Tips):

One of the most common uses for these methods is to communicate between a parent and its direct children. In these cases, you can actually listen to an $emit from a child with v-on. This allows you to keep the convenience of events with added explicitness.

However, when communicating between distant descendants/ancestors, $emit won’t help you. Instead, the simplest possible upgrade would be to use a centralized event hub.

From the documentation of $dispatch

Dispatch an event, first triggering it on the instance itself, and then propagates upward along the parent chain. The propagation stops when it triggers a parent event listener, unless that listener returns true.

on the other hand $emit:

Trigger an event on the current instance. Any additional arguments will be passed into the listener’s callback function.

So you can see, if you are passing communication to multiple layer of parent elements via $dispatch, you have to handle that code differently with $emit