vue-watch-decorator

vue-watch-decorator

Typesafe watch decorator for vue-class-component

Installation

npm i -S vue-watch-decorator

Usage

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

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
	}
}