Trigger Vuex action with on socket event about vue-socket.io

[MarlBurroW]

Yes, sounds great for me ! I think it's important because it allow to create more complex flow when a socket event is triggered:

EXAMPLE:

actions: {
    SOCKET_USER_MESSAGE: (context, payload) => {
      context.dispatch('new_message_notification', payload);
      context.commit('add_message', payload);
      AudioManager.play('new_message_received');
    }
  }

[MetinSeylan]

added roadmap

[michgeek]

hey @MarlBurroW can you tell more about this ? I'm not sure to understand, maybe I can help

[MarlBurroW]

Hey, i'll try to explain you:

With Vuex, you can:

• dispatch actions (actions commit mutations and/or asynchronous operations)
• commit mutations (mutation allow to modify the vuex state)
  See https://vuex.vuejs.org/en/mutations.html and https://vuex.vuejs.org/en/actions.html

Currently, with Vue-Socket.io, you can trigger Vuex mutations on a socket.io event by prefixing the name of the mutation with "SOCKET_".

BUT (if I'm not wrong) you can't dispatch actions by this same way.
it could be nice to do the same thing for actions, because sometime you need to trigger more than one mutation on a socket event. Sometime you need to make some other operations, asynchrone calls, etc... and actions are made for that.

[michgeek]

What do you think of having the same concept for actions ?

{
  mutations: {
    my_mutation: (state) => { /*...*/ },
    another_mutation: (state) => { /*...*/ },
    SOCKET_USER_MESSAGE: (state) => { /*...*/ }
  ],
  actions: {
    SOCKET_USER_MESSAGE: (context, payload) => {
      // ... do things ...
      context.dispatch('my_mutation', payload);
      context.dispatch('another_mutation', payload);
    }
  }
}

You can decide to declare the socket event either in actions or mutations or both