[Vuejs]-Vuejs accesing events and data between multiple components

0👍

TL;DR;

Vuex may solve your problem, but need to see more code to know what’s going on

There are multiple ways of achieving this, but I’ll only list two.

Global State Management (Vuex), and props/listeners

Global State Management (Vuex)

If you know you’ll only have one instance of each of the components (one map, one autocomplete) this is easy, fast, and reliable solution. The two components do not need to know about each other, they both deal with the global store. The autocomplete will update the data in the store, and the map will be notified whenever the variables it subscribes to change, and update accordingly.

The downside is…
Using vuex makes it harder to reuse and components.. Once you have more than one instance (ie. two autocompletes and two maps) then you may run into some issues, so you’ll need to add additional complexity.

Props/Emit

If the two components have a direct connection, either siblings or parent-child relation, using this interaction (IMHO) is preferred.

The autocomplete component can have an @change or even a v-model set up, that parent component would link to the map component using a prop.

It seems like you may be doing it this way, which is not wrong, but without seeing any code, it’s hard to make an assessment.

Leave a comment