Module `flamingo-carotene-state-manager`¶

The state-manager gives you the possibility to set and get states, and watch changes. Under the hood redux is used.

How to initialize¶

npm i -D flamingo-carotene-state-manager

Import state manager¶

import state from 'flamingo-carotene-state-manager'

Note: The state-manager is a singleton and already returns an instance but a class.

Creating initial state¶

const initialState = {
 {
  foo: true,
  bar: {
    foo: 'oof',
    baz: 'zab'
  }
  baz: {
    data: null
  }
}

Initialize class with initial state¶

state.init(initialState)

How to use¶

Getting a state¶

You can get a value of a state by using get(). The first parameter is a .-notated path of the value inside the state object.

state.get('bar.baz')

Setting a state¶

By calling set() you'll set a new value for a key. You can even create new state values with set.

state.set('baz.data', 'myNewValue')

Watching a state¶

You can watch for a state change. Just call watch() with a key you're like to watch, and the method will be called instantly, when a state change happens. The callback will get the new state as the first parameter.

state.watch(`baz.data`, (newValue) => {
  console.log('State "baz.data" has changed to new value!', newValue) 
})

Note that the newValue is an immutable. So you can't change the state by changing newValue inside the watcher. To change states, always call set().

Options¶

state.watch(`baz.data`, myCallback, { noCompare: true })

noCompare¶

You can enforce triggering listener functions even if the state has not changed by adding noCompare: true to the options object.

Default is false

Module flamingo-carotene-state-manager¶