# babel-plugin-jsx-v-model

> JSX v-model transform

Latest version **2.0.3** (published 2017-08-24) · MIT license · 0 weekly downloads

## Install

```sh
npm install babel-plugin-jsx-v-model
pnpm add babel-plugin-jsx-v-model
yarn add babel-plugin-jsx-v-model
bun add babel-plugin-jsx-v-model
```

## 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 | 2.0.3 |
| Published | 2017-08-24 |
| First published | 2017-07-18 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 3 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 155 |
| Author | Nicolai Moraru |
| Maintainers | nickmessing |
| Keywords | Vue, jsx, v-model |

## Links

- npm: https://www.npmjs.com/package/babel-plugin-jsx-v-model
- Repository: https://github.com/nickmessing/babel-plugin-jsx-v-model
- Homepage: https://github.com/nickmessing/babel-plugin-jsx-v-model#readme
- Issues: https://github.com/nickmessing/babel-plugin-jsx-v-model/issues
- npm.io page: https://npm.io/package/babel-plugin-jsx-v-model

## Dependencies (3)

- [svg-tags](https://npm.io/package/svg-tags.md) ^1.0.0
- [html-tags](https://npm.io/package/html-tags.md) ^2.0.0
- [babel-plugin-syntax-jsx](https://npm.io/package/babel-plugin-syntax-jsx.md) ^6.18.0

## Recent versions

- 2.0.3 (latest) — 2017-08-24
- 2.0.2 — 2017-08-24
- 2.0.1 — 2017-08-18
- 2.0.0 — 2017-08-17
- 1.0.0 — 2017-07-18

## README

[![Build Status](https://travis-ci.org/nickmessing/babel-plugin-jsx-v-model.svg?branch=master)](https://travis-ci.org/nickmessing/babel-plugin-jsx-v-model)

## JSX v-model for Vue JSX

This babel plugin adds some syntactic sugar to JSX.

### Usage:

```bash
npm i babel-plugin-jsx-v-model -D
```

Then add `jsx-v-model` to your `.babelrc` file under `plugins`

example .babelrc:
```json
{
  "presets": ["es2015"],
  "plugins": ["jsx-v-model", "transform-vue-jsx"]
}
```

code:
```js
Vue.component('hello-world', {
  data: () => ({
    text: 'Hello World!'
  }),
  render () {
    return (
      <div>
        <input type="text" v-model={this.text} />
        {this.text}
      </div>
    )
  }
})
```

Behaviour is similar to vue template's [v-model](https://vuejs.org/v2/api/#v-model).

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