# vue-watch-decorator

> Typesafe watch decorator for vue-class-component

Latest version **1.0.2** (published 2022-09-19) · ISC license · 0 weekly downloads

## Install

```sh
npm install vue-watch-decorator
pnpm add vue-watch-decorator
yarn add vue-watch-decorator
bun add vue-watch-decorator
```

## Health

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

Positive: has types; no vulnerabilities; high quality score.

Warnings: low downloads; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.2 |
| Published | 2022-09-19 |
| First published | 2022-09-18 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 1 |
| Unpacked size | 4.6 KB |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Sergey Peskov |
| Maintainers | sergeypeskov |

## Links

- npm: https://www.npmjs.com/package/vue-watch-decorator
- Repository: https://github.com/sergey-peskov/vue-watch-decorator
- Homepage: https://github.com/sergey-peskov/vue-watch-decorator#readme
- Issues: https://github.com/sergey-peskov/vue-watch-decorator/issues
- npm.io page: https://npm.io/package/vue-watch-decorator

## Dependencies (1)

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

## Recent versions

- 1.0.2 (latest) — 2022-09-19
- 1.0.1 — 2022-09-18
- 1.0.0 — 2022-09-18

## README

# vue-watch-decorator

Typesafe watch decorator for [vue-class-component](https://github.com/vuejs/vue-class-component)

## Installation

``` sh
npm i -S vue-watch-decorator
```

## Usage

```ts
import Vue from 'vue';
import Component from 'vue-class-component';
import { VueWatchDecorator } from 'vue-watch-decorator';

@Component
export default class App extends Vue {
	inputValue: string = '';

	@VueWatchDecorator<App>((t) => t.inputValue, { immediate: true })
	onChangeInputValue() {}
}
```

is equivalent to

```ts
import Vue from 'vue'
import Component from 'vue-class-component'

@Component
export default class App extends Vue {
	inputValue: string = '';

	onChangeInputValue() {}

	created() {
		this.$watch(() => this.inputValue, this.onChangeInputValue, { immediate: true });
	}

	beforeDestroy() {
		// Deleting all subscriptions created with $watch
	}
}
```

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