Listeners

Creating a listener

Listeners add a touch of reactivity to your code, and use EventTarget under the hood.

If the proxy in front of your stores state detects a change to a keys value; a typed Custom Event will be dispatched.

You can also pass event listener options, see the API reference.

import createStore from 'olallie';

const store = createStore({
  state: {
    count: 0,
  },
});

// (parameter) event: StoreEvent<S, K>
const listener = store.listen('count', ({ detail, timeStamp }) => {
  // Values are type-safe
  /*
  param (detail): {
    value: number;
    oldValue: number;
  }
  */
  console.log('%j', {
    newValue: detail.value,
    oldValue: detail.oldValue,
    timeStamp
  });
}, false);

store.count++;

Removing a listener

Removing a listener calls removeEventListener() on the stores EventTarget.

listener.unlisten();