react-webstorage v0.0.4

react-webstorage

Use any implementation of W3C WebStorage API directly as a React/Flux-style store.

var WebStorage = require('react-webstorage')
, dispatcher = require('./path/to/app-dispatcher')
;

var webStorage = new WebStorage(window.localStorage ||
	window.sessionStorage /* or poly-fill thereof */
);

dispatcher.register(function (payload) {
	switch (payload.actionType) {
	case 'A':
		webStorage.setItem(payload.key, payload.item);
		break;
	case 'B':
		webStorage.removeItem(payload.key);
		break;
	case 'C': 
		webStorage.clear();
		break;
	default:
		return;
	}
});

// Later, inside a component...

	getInitialState: function () {
		return {
			foo: webStorage.getItem('foo');
		};
	},
	updateState: function () {
		this.setState({
			foo: webStorage.getItem('foo')
		});
	},
	componentDidMount: function () {
		webStorage.addListener('change', this.updateState);
	},
	componentWillUnmount: function () {
		webStorage.removeListener('change', this.updateState);
	}

WebStorage Instance implements the WebStorage API, and in cases where the contents of WebStorage is modified (setItem, removeItem, clear) fires a change event to registered listeners.

WebStorage API details here: https://developer.mozilla.org/en-US/docs/Web/API/Web_Storage_API