Meet npm Pro: unlimited public & private packages + package-based permissions.Learn more »

flux-store

1.2.4 • Public • Published

flux-store

A simple store for Flux.

Build Status Dependency Status devDependency Status

Install

$ npm install flux-store

Usage

var FluxStore = require('flux-store'); // that's us, such meta
var myDispatcher = require('flux-dispatcher');
var Constants = require('./Constants');
 
var ActionTypes = Constants.ActionTypes;
 
var Store = FluxStore.extend({
    dispatcher: myDispatcher,
    stateStuff: {
        loading: false,
        objectFoo: {},
        arrayOfBaz: []
    },
    getStateStuff: function () {
 
        return this.stateStuff;
    },
    onDispatcherAction: function (payload) {
 
        var action = payload.action;
 
        if (ActionTypes.SEND_REQUEST === action.type) {
            this.stateStuff.loading = true;
            this.emitChange();
        }
 
        if (ActionTypes.RECEIVE_RESPONSE === action.type) {
            this.stateStuff.loading = false;
            this.stateStuff.objectFoo = action.data.objectFoo;
            this.stateStuff.arrayOfBaz = action.data.arrayOfBaz;
            this.emitChange();
        }
    }
});
 
module.exports = Store;

API

onDispatcherAction(payload)

This is the handler for your Dispatcher's action events.

registerDispatcher(Dispatcher)

This is done automatically when you use extend to create a store and pass in a dispatcher. This connects your Store to your Dispatcher and populates your Store's dispatchToken property so Flux stuff (like waitFor) continues to work.

emitChange()

This emits a change event so listeners know that state has changed.

Change listeners

Two functions are included in your new Store. You'll probably use these in your React controller-views.

addChangeListener(callback)

You can use this in ControllerView.componentDidMount like:

componentDidMount: function () {
 
    Store.addChangeListener(this.onStoreChange);
},

removeChangeListener(callback)

You can use this in ControllerView.componentWillUnmount like:

componentWillUnmount: function () {
 
    Store.removeChangeListener(this.onStoreChange);
},

License

MIT

Don't forget

What you make with flux-store is more important than flux-store.

Install

npm i flux-store

DownloadsWeekly Downloads

231

Version

1.2.4

License

MIT

Last publish

Collaborators

  • avatar