Write Mustache.js templates in elements and have them update automatically with reactive data.
<button>Clicked: {{ count }}</button> $('button').watcher({ count: 0 }).click(function () { this.watcher().count++ }) $('button').click().text() // Clicked: 1npm:
npm i jquery-watcheryarn:
yarn add jquery-watcherPass a data object that you want to be reactive. Returns jQuery. This will immediately render your template.
<div>Hello {{ value }}</div> $('div').watcher({ value: 'World' }).text() // Hello World $('div').watcher({ value: 'Adam' }).text() // Hello AdamIf no argument is passed, it will return the reactive data object. If you manipulate the properties on the object, it will automatically re-render your template.
<div>Hello {{ text }}</div> const data = $('div').watcher({ text: 'World' }).watcher() data.text = 'Adam' $('div').text() // Hello Adam- CDN
- Config Options
- Reactive Arrays
- Allow template modification