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:
@@ -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
|
||||||
|
|
||||||
|
|||||||
@@ -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!
|
||||||
|
|||||||
Vendored
+1
-1
File diff suppressed because one or more lines are too long
+1
-1
@@ -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": {
|
||||||
|
|||||||
@@ -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()
|
||||||
|
|||||||
Reference in New Issue
Block a user