How to call the value in component, which is stored in Store.js (React-Flux)

Question

I am pretty new to Flux and react, i understand how to store value through flux. I have stored value in some variables in store.js of flux. But i want to use that value in react component now, can anyone guide me, how to do that. I am trying like that Component file like this-

           AppActions.addItem(currentObject.username,currentObject.password);
            var test = AppStore.addChangeListener(this.action);
            console.log(test);

action is the value, which i am trying to call.

My Store.js Looks like this

  var AppStore = assign({}, EventEmitter.prototype, {
      emitChange: function () {
          this.emit(CHANGE_EVENT);
      }
   });

AppDispatcher.register(function (callback) {
    //console.log(username);
    //console.log(password);
    var action = callback.action;
    //console.log(action);
    return true;

});

Help me in this. thanks

score 0 · Accepted Answer · edited May 23 '17 at 12:22

It's probably not a direct answer but if you are starting a new app I would recommend you to use Redux with react-redux.

Redux is a predictable state container for JavaScript apps.

It helps you write applications that behave consistently, run in different environments (client, server, and native), and are easy to test. On top of that, it provides a great developer experience, such as live code editing combined with a time traveling debugger.

From my personal experience, I can tell that it's much more clear, descriptive and maintainable. And it's very small library so it's easy to understand how everything works. It might be a good solution to your problem.

Todo app example
You can also check out awesome egghead.io free tutorial - Getting Started with Redux

Here is the answer about the redux benefits by its author Dan Abramov

How to call the value in component, which is stored in Store.js (React-Flux)

1 Answers1