2
0
mirror of https://github.com/tenrok/vue-native-websocket.git synced 2026-06-23 01:40:36 +03:00

Add custom pass to store handler

This commit is contained in:
Joshua Morris
2018-06-05 11:34:25 -06:00
parent 649485e28b
commit 4d8bf21ab4
5 changed files with 60 additions and 3 deletions
+3
View File
@@ -2,6 +2,9 @@
This package is [semantic versioned](http://semver.org/) This package is [semantic versioned](http://semver.org/)
## 2.0.8
- [feature]: custom pass to store logic. Defaults to original passToStore code if no custom logic provided
## 2.0.7 ## 2.0.7
- [feature]: manual connect/disconnect - [feature]: manual connect/disconnect
+44
View File
@@ -189,6 +189,50 @@ actions: {
Use the `.sendObj({some: data})` method on the `$socket` object to send stringified json messages. Use the `.sendObj({some: data})` method on the `$socket` object to send stringified json messages.
##### Custom socket event handling
Provide you own custom code to handle events received via the `passToStoreHandler` option. The function you provide will be passed the following arguments:
1. event name
2. event
3. original/default handler code function `function (eventName, event)`. This allows you to optionally do some basic preprocessing before handing the event over to the original handler.
The original passToStore code is used if no `passToStoreHandler` is configured.
Here is an example of passing in a custom handler. This has the original passToStore code to give you an example of what you can do:
``` js
Vue.use(VueNativeSock, 'ws://localhost:9090', {
passToStoreHandler: function (eventName, event) {
if (!eventName.startsWith('SOCKET_')) { return }
let method = 'commit'
let target = eventName.toUpperCase()
let msg = event
if (this.format === 'json' && event.data) {
msg = JSON.parse(event.data)
if (msg.mutation) {
target = [msg.namespace || '', msg.mutation].filter((e) => !!e).join('/')
} else if (msg.action) {
method = 'dispatch'
target = [msg.namespace || '', msg.action].filter((e) => !!e).join('/')
}
}
this.store[method](target, msg)
}
})
```
Here is an example of do some preprocessing, then pass the event onto the original handler code:
``` js
Vue.use(VueNativeSock, 'ws://localhost:9090', {
passToStoreHandler: function (eventName, event, next) {
event.data = event.should_have_been_named_data
next(eventName, event)
}
})
```
## Examples ## Examples
TODO: post your example here! TODO: post your example here!
+1 -1
View File
File diff suppressed because one or more lines are too long
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"name": "vue-native-websocket", "name": "vue-native-websocket",
"version": "2.0.7", "version": "2.0.8",
"description": "native websocket implemantation for vuejs and vuex", "description": "native websocket implemantation for vuejs and vuex",
"main": "dist/build.js", "main": "dist/build.js",
"scripts": { "scripts": {
+10
View File
@@ -12,6 +12,8 @@ export default class {
this.reconnectTimeoutId = 0 this.reconnectTimeoutId = 0
this.reconnectionCount = 0 this.reconnectionCount = 0
this.passToStoreHandler = this.opts.passToStoreHandler || false
this.connect(connectionUrl, opts) this.connect(connectionUrl, opts)
if (opts.store) { this.store = opts.store } if (opts.store) { this.store = opts.store }
@@ -61,6 +63,14 @@ export default class {
} }
passToStore (eventName, event) { passToStore (eventName, event) {
if (this.passToStoreHandler) {
this.passToStoreHandler(eventName, event, this.defaultPassToStore)
} else {
this.defaultPassToStore(eventName, event)
}
}
defaultPassToStore (eventName, event) {
if (!eventName.startsWith('SOCKET_')) { return } if (!eventName.startsWith('SOCKET_')) { return }
let method = 'commit' let method = 'commit'
let target = eventName.toUpperCase() let target = eventName.toUpperCase()