Reactive-localstorage NPM

reactive-localstorage

A reactive localStorage with no dependency

Install

yarn add reactive-localstorage

npm i -S reactive-localstorage

Features

inject window.localStorage / window.sessionStorage
Emit changes from same window
Emit external changes

Usage

Changes from reactive-localstorage or other pages will be emitted as events

import localStorage, { localStorage } from 'reactive-localstorage';

localStorage.on('change', (key, value) => {
  console.log(`key ${key} changed to ${value}`);
});

localStorage.setItem('foo', 'bar');

// print key foo changed to bar

It also works with window.localStorage

window.localStorage.setItem('foo', 'alice');

// print key foo changed to alice

You can also trigger changes manually, especially when you have other sources that manage localStorage.

localStorage.feed('foo', 'bob');

// print key foo changed to bob

SessionStorage is also supported

import { sessionStorage } from 'reactive-localstorage';

sessionStorage.on('change', (key, value) => {
  console.log(`key ${key} changed to ${value}`);
});

sessionStorage.setItem('foo', 'bar');

// print key foo changed to bar