# vue-vertx3-eventbus-client

> Vertx3 Eventbus client for Vue.js

Latest version **3.6.0** (published 2020-06-10) · GPL-3.0 license · 0 weekly downloads

## Install

```sh
npm install vue-vertx3-eventbus-client
pnpm add vue-vertx3-eventbus-client
yarn add vue-vertx3-eventbus-client
bun add vue-vertx3-eventbus-client
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 3.6.0 |
| Published | 2020-06-10 |
| First published | 2018-01-10 |
| Weekly downloads | 0 |
| License | GPL-3.0 |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Unpacked size | 594.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 11 |
| Author | Klaus Schwartz |
| Maintainers | tntclaus |
| Keywords | vue.js, vertx3, eventbus |

## Links

- npm: https://www.npmjs.com/package/vue-vertx3-eventbus-client
- Repository: https://github.com/eraga/vue-vertx3-eventbus-client
- Homepage: https://github.com/eraga/vue-vertx3-eventbus-client#readme
- Issues: https://github.com/eraga/vue-vertx3-eventbus-client/issues
- npm.io page: https://npm.io/package/vue-vertx3-eventbus-client

## Dependencies (1)

- [vertx3-eventbus-client](https://npm.io/package/vertx3-eventbus-client.md) ^3.6.0

## Alternatives

- [async-exit-hook](https://npm.io/package/async-exit-hook.md) — 3.7M weekly downloads
- [evnty](https://npm.io/package/evnty.md) — 7.2K weekly downloads
- [eleventy-plugin-asciidoc](https://npm.io/package/eleventy-plugin-asciidoc.md) — 3.5K weekly downloads
- [@jswork/next-get2get](https://npm.io/package/@jswork/next-get2get.md) — 945 weekly downloads
- [@dashersw/axon](https://npm.io/package/@dashersw/axon.md) — 934 weekly downloads

## Recent versions

- 3.6.0 (latest) — 2020-06-10
- 3.5.3 — 2018-01-12
- 3.5.2 — 2018-01-12
- 3.5.1 — 2018-01-10
- 3.5.0 — 2018-01-10

## README

# vue-vertx3-eventbus-client [![NPM version](https://img.shields.io/npm/v/vue-vertx3-eventbus-client.svg)](https://www.npmjs.com/package/vue-vertx3-eventbus-client)
![VueJS v2.x compatible](https://img.shields.io/badge/vue%202.x-compatible-green.svg) ![VertX v3.6 compatible](https://img.shields.io/badge/VertX%203.6-compatible-green.svg)

Vertx 3.6 EventBus plugin for VueJS that wraps official [vertx3-eventbus-client@3.6.0](https://www.npmjs.com/package/vertx3-eventbus-client).


## Install
### NPM
You can install it via [NPM](http://npmjs.org/).
```
$ npm install vue-vertx3-eventbus-client
```
### Manual
Download zip package and unpack and add the `vue-vertx3-eventbus-client.js` file to your project from dist folder.
```
https://github.com/eraga/vue-vertx3-eventbus-client/archive/master.zip
```

## Usage
Register the plugin, it will connect to `/`
```js
import VertxEventBus from 'vue-vertx3-eventbus-client'
Vue.use(VertxEventBus, { path: '/eventbus', port: 8082 })
```
or connect to other address:
```js
Vue.use(VertxEventBus, {
    host: 'www.example.com',
    path: '/eventbus'
  })
```
It is possible to pass `vertx3-eventbus-client` and `SockJS` options too:
```js
Vue.use(VertxEventBus, {
  path: '/eventbus',
  port: 8082,
  options: {
    transports: [ // whitelist "long polling" and "websocket" Sock JS transports
      'xhr-polling',
      'websocket',
    ],
  },
})
```


Use it in your components with configuration at `eventbus` section:
```html
<script>
  export default {
    name: 'Hello Vertx EventBus',
    data () {
      return {
        tableData: []
      }
    },
    methods: {
    },
    eventbus: {
      lifecycleHooks: {
        created (context, eventbus) {

          let header = {
            action: 'fetchAllPages',
          }
          
          let payload = {}

          eventbus.send('pages.db.queue', payload, header, function (err, reply) {
            if (err) {
              console.error('Failed to get list of pages', err)
              return
            }
            
            context.tableData = reply.body
          })
        },
      },
      handlers: [
        {
          address: 'page.saved',
          headers: {},
          callback: function () {
            // execute something upon receipt 
          },
        },
      ],
    },
  }
</script>
```

`lifecycleHooks` are executed together with corresponding Vue hooks: `created`, `mounted`, etc.
Put your `handler` objects to `handlers` section. They will be registered at `beforeCreate` and unregistered at `beforeDestroy`.


EventBusClient object can be reached with `this.$eventBus`:
```html
<script>
export default {
    name: 'Hello Vertx EventBus',
    data () {
      return {
        form: {}, // object contaning form fields
        saving: false //saving indicator 
      }
    },
    methods: {
      formSubmit () {
        
        let header = {action: 'savePage'}
        if (!this.$route.params.id) {
          header.action = 'createPage'
        }
        this.saving = true

        let body = JSON.parse(JSON.stringify(this.form))

        let context = this
        this.$eventBus.send('pages.db.queue', body, header, function (err, reply) {
          if (err) {
            console.error('Failed to save page', err)
            context.saving = false
            return
          }
          context.saving = false
        })
      }
    },
}
</script>
```

## Build
This command will build a distributable version in the `dist` directory.
```bash
npm run build
```

## Contribution
Pull requests improving the usage and fixing bugs are welcome!

## Contact

Copyleft © 2018 eRaga Infosystems and @tntclaus

[![@eraga](https://img.shields.io/badge/github-eraga-blue.svg)](https://github.com/eraga) [![@eraga](https://img.shields.io/badge/www-eraga.net-orange.svg)](https://www.eraga.net/)

---
_Source: https://npm.io/package/vue-vertx3-eventbus-client · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._