mobx-state-tree-localstorage

[![npm version](https://badge.fury.io/js/mobx-state-tree-localstorage.svg)](https://badge.fury.io/js/mobx-state-tree-localstorage) [![CircleCI](https://circleci.com/gh/isaachinman/mobx-state-tree-localstorage.svg?style=shield)](https://circleci.com/gh/isa

Usage no npm install needed!

<script type="module">
  import mobxStateTreeLocalstorage from 'https://cdn.skypack.dev/mobx-state-tree-localstorage';
</script>

README

mobx-state-tree-localstorage

npm version CircleCI

Persist your mobx-state-tree stores in localStorage

What is this?

mobx-state-tree-localstorage is a helper package, which allows you to easily persist your mob-state-tree stores in localStorage.

Setup

1. Installation

yarn add mobx-state-tree-localstorage

You need to also have mobx and mobx-state-tree installed.

2. Usage

Instead of calling model.create(), pass it into the persistInLocalStorage function, which will persist the tree in localStorage, and also return the created model:

// Change this
const store = Store.create({
    todos: [
        {
            title: "Get coffee"
        }
    ]
})

// To this
const store = persistInLocalStorage({
  tree: Store,
  id: '@myapp/TodoStore',
  initialState: {
    todos: [
        {
            title: "Get coffee"
        }
    ]
  }
})

Config Options

Key Explanation
tree A mobx-state-tree model
id A string ID which will be used to get/set the tree in localStorage
initialState The initial state for your store
blacklistKeys Any top-level keys for your store which you don't want to persist in localStorage