# vue-model-on

> Allows you to set the event type when binding model data in Vue.js

Latest version **1.1.0** (published 2017-04-05) · MIT license · 0 weekly downloads

## Install

```sh
npm install vue-model-on
pnpm add vue-model-on
yarn add vue-model-on
bun add vue-model-on
```

## 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 | 1.1.0 |
| Published | 2017-04-05 |
| First published | 2017-01-08 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| Author | Craig Humphreys |
| Maintainers | craigh411 |
| Keywords | vue.js, directives, v-model |

## Links

- npm: https://www.npmjs.com/package/vue-model-on
- Repository: https://github.com/craigh411/vue-model-on
- Homepage: https://github.com/craigh411/vue-model-on#readme
- Issues: https://github.com/craigh411/vue-model-on/issues
- npm.io page: https://npm.io/package/vue-model-on

## Dependencies (1)

- [vue](https://npm.io/package/vue.md) ^2.1.8

## Recent versions

- 1.1.0 (latest) — 2017-04-05
- 1.0.2 — 2017-01-08
- 1.0.0 — 2017-01-08

## README

# vue-model-on for Vue 2.x

By default Vue's `v-model` uses the `input` event to update the underlying model data, `vue-model-on` is a simple directive that allows you to set the event type for updating model data in Vue.js. Simply use `v-model-on:event="myVar"` instead of `v-model="myVar"` to set up your two way binding.

## Install

Install via `npm`:

`npm install vue-model-on`

Then simply use `require`:

`require('vue-model-on')`

or import for `ES6` syntax:

`import "vue-model-on"`

Also available via CDN on unpkg, simply add the following to your page:

`<script src="https://unpkg.com/vue-model-on@latest/dist/vue-model-on.js" ></script>`

## Example

The following will update `myVar` on `blur` event, although you may use any javascript event you want to:

**HTML**

```HTML
<input v-model-on:blur="myVar" />
```

**Vue Instance**
```javascript
new Vue({
  el: '#app',
  data: {
    myVar: '' // declare model variable
  }
});
```

[Check it out on JSFiddle](https://jsfiddle.net/craig_h_411/6Lmb1h9s/)

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