Added support for namespaced vuex modules

pull/242/head
David Giangrave 4 years ago
parent 45860773e4
commit bcd466a22e

@ -126,7 +126,7 @@ this.sockets.unsubscribe('EVENT_NAME');
```
#### 🏆 Vuex Integration
<p>When you set store parameter in installation, `Vue-Socket.io` will start sending events to Vuex store. If you set both prefix for vuex, you can use `actions` and `mutations` at the same time. But, best way to use is just `actions`</p>
<p>When you set store parameter in installation, `Vue-Socket.io` will start sending events to Vuex store. The prefix for mutations and actions are both optional and will default to none. The prefix may be useful in differentiating what type of event should be sent to the store in the case of an action and mutation with the same name.</p>
``` javascript
import Vue from 'vue'
@ -149,6 +149,10 @@ export default new Vuex.Store({
})
```
##### Vuex Namespaced Modules
<p>When using namespaced modules, the prefix, if one exists, will be parsed into the action name. For example, if the emitted event it `jobs/runTask` and the action prefix is `SOCKET_`, then the vuex action should be `SOCKET_runTask` in the jobs namespace. In this example the vuex store will receive the dispatched action: `jobs/SOCKET_runTask`.</p>
#### 🏆 Connection Namespace
<p>When you need to handle more than one namespaced connection, you need to set the `useConnectionNamespace` property of
the options object to true. What this does is telling the plugin that you are going to be using more than one namespaced connection and you want to put every connection in their own `$socket` key.</p>

File diff suppressed because one or more lines are too long

@ -4,10 +4,8 @@ export default class EventEmitter{
constructor(vuex = {}){
Logger.info(vuex ? `Vuex adapter enabled` : `Vuex adapter disabled`);
Logger.info(vuex.mutationPrefix ? `Vuex socket mutations enabled` : `Vuex socket mutations disabled`);
Logger.info(vuex ? `Vuex socket actions enabled` : `Vuex socket actions disabled`);
this.store = vuex.store;
this.actionPrefix = vuex.actionPrefix ? vuex.actionPrefix : 'SOCKET_';
this.actionPrefix = vuex.actionPrefix;
this.mutationPrefix = vuex.mutationPrefix;
this.listeners = new Map();
}
@ -91,19 +89,27 @@ export default class EventEmitter{
*/
dispatchStore(event, args){
if(this.store && this.store._actions){
if(this.store) {
if(this.store._actions){
let prefixed_event = this.actionPrefix + event;
let action_name = event;
for (let key in this.store._actions) {
if (!!this.actionPrefix) {
let namespace_sep_pos = event.lastIndexOf('/');
action_name = (namespace_sep_pos !== -1) ? [event.slice(0, namespace_sep_pos+1), this.actionPrefix, event.slice(namespace_sep_pos+1)].join('') : this.actionPrefix + event;
}
for (let key in this.store._actions) {
let action = key.split('/').pop();
if(key === action_name) {
if(action === prefixed_event) {
Logger.info(`Dispatching Action: ${key}, Data:`, args);
Logger.info(`Dispatching Action: ${key}, Data:`, args);
this.store.dispatch(key, args);
this.store.dispatch(key, args);
}
}
@ -111,15 +117,18 @@ export default class EventEmitter{
if(this.mutationPrefix) {
let prefixed_event = this.mutationPrefix + event;
let mutation_name = event;
for (let key in this.store._mutations) {
if (!!this.mutationPrefix) {
let namespace_sep_pos = event.lastIndexOf('/');
mutation_name = (namespace_sep_pos !== -1) ? [event.slice(0, namespace_sep_pos+1), this.mutationPrefix, event.slice(namespace_sep_pos+1)].join('') : this.mutationPrefix + event;
}
let mutation = key.split('/').pop();
for (let key in this.store._mutations) {
if(mutation === prefixed_event) {
if(key === mutation_name) {
Logger.info(`Commiting Mutation: ${key}, Data:`, args);
Logger.info(`Committing Mutation: ${key}, Data:`, args);
this.store.commit(key, args);

Loading…
Cancel
Save