A light-weight local browser state build on the subscriber pattern.
$ yarn add state-watcher
import createState from 'state-watcher';
const [state, watcher] = createState({
playerName: '',
score: 0,
});
watcher.on('change', ['score'], (state, score) => {
document.getElementById('score-container').innerText = score;
});
watcher.on('change', ['playerName'], (state, name) => {
document.getElementById('player-name-container').innerText = name;
});
function updatePlayerScore(score) {
state.score = score;
}
function updatePlayerName({ target }) {
state.playerName = target.value || '';
}
Returns a tuple with the state object and a watcher.
Type: object
Default: {}
A plain-old JavaScript object that will serve as the default state.
Type: object
An object containing an on
, has
, and keys
method.
Type: string
A string that indicates which event should be subscribed to on the watcher. Currently only "change"
is supported.
Type: Array<string>
Optional: ✅
An array of strings indicating which field(s) the callback should subscribe to on the specified event. When no fields are passed in, all fields for the given event will fire the callback.
Type: function
A callback that is fired when an event of type
occurs to the specified (or all) fields.