Passing google map route data in empty array in store

I’m new to vueX, seems a bit hard to understand in the first place.

Here’s my problem, I’d like to pass data from a component to another via VueX.

In a component I have an event calling a function with an argument that is an object.

Here’s the methods used :

routeItemPressed(route) {
The console log returns an object :

Proxy {destination: {…}, distance: {…}, duration: {…}, origin: {…}, id: “J86P3joWWd8UuvsmrQcR”}
[[Handler]]: Object
[[Target]]: Object
[[IsRevoked]]: false

And now I’d like to add this object to an array in the store so that I can reuse the object in another component.

Code in store looks like this :
import { createStore } from ‘vuex’

    export default createStore({
      state: {        
        routes: [],
      mutations: {    
      actions: {   
      modules: {

Tried a lot of things but cannot find a way to do it.
Hope you can help me and thanks a lot !

The code provided is currently not properly formatted for this forum. In its current state it’s illegible which makes it hard for people to help you.

Please read the following guide about how to properly format code and then edit your topic accordingly.


Mutations – mutate the value of the state.
Actions, like mutations but async.
Write your mutation :

mutations: {
    changeRoutes(state, value){
        state.routes = value

then in your component, in your methods:

methods: {
    ...mapMutations(['changeRoutes']) // look up the map utilities. Makes things neater. 
      this.changeRoutes(value) // "alternatively instead of mapMutations, you could use Cleaner though with mapMutations

Updating Vuex state should reflect changes across all components that import that state. Assuming no reactivity caveats that you can easily overcome.

Was a good help !
Thank you