freighter

Freighter

A flux storage mixin for reactjs components. This helps you bind your storage updates to your react classes and a DRY way. Please check out the examples directory.

Demo [source] [live demo]

Install

npm install freighter

Use

This works with facebook's flux implementation/api, and in turn, works with both lcars and cargo-bay work really nice with this mixin.

freighter is a small mixin, and the source should be easy to digest.

When your component mounts, we add store event listeners to listen for store updates.

You are assumed to implement a getStateFromStores method and an array listing the stores you want to watch for updates on, in your Reactjs class.

In practice

The best way to use this mixin is to implement a function in your store that will return your component state.

getStateFromStores: function(){
  return HelloWorldStore.getDataFromStore();
},

You can see the example of HelloWorldStore.getDataFromStore().

var HelloWorldStore =  merge(CargoBay, {
  getDataFromStore: function(){
    return HelloWorldData.clonedData();
  }
});

Purpose

We were implementing this same flow in a lot of our react classes throughout our flux application. This allowed to be DRY.

Run examples

npm install

npm run examples

Run tests

npm install

npm test