Combine results React getInitialState and Reflux getInitialState

[max-mykhailenko]

How I can run React getInitialState after Reflux getInitialState?

...
app.ModelView = React.createClass({
    mixins: [Reflux.connect(Store, 'models')],
        getInitialState: function() {
          var that = this,
              model = _.find(that.state.models, function(model) { // now this.state is null
                return model.id === that.props.modelID;
              });
          return {model: model};
...

[gpbl]

Hi, I also find myself in a similar situation: my store has all the models, but i want to use only that specified by an id. What could be a good practice for this? Or am I following an anti-pattern?

I was tempted to make another store with the single model. Or make the "all-models-store" having a activeItem state. Not sure yet :-)

For now, I put the code you are using, @max-mykhailenko, inside the render method – but I'm not 100% happy with this.

[max-mykhailenko]

@gpbl Now I have more interesting solution

  app.ModelView = React.createClass({
    mixins: [Reflux.connect(AccessRightsStore, 'models')], // Don't want store models to state, but want to connect Store
    getInitialState: function() {
      return {model : AccessRightsStore.getModel(this.props.modelID)};
    },

And in the store

getModel : function (modelID) {
      return _.find(this.models, function(model) {
        return model.id === modelID;
      });
    },
    // this will be called by all listening components as they register their listeners
    getInitialState: function() {
      if (this.models) {
        return this.models;
      } else {
        this.models = Globals.models;
        return this.models;
      }
    }

It's a good pattern or anti-pattern? I don't now :)

[gpbl]

@max-mykhailenko that doesn't feel right - if you assume you have always that id in the store, why bother to connect the store at all? Couldn't you just pass model as prop instead of the id?
It makes sense to connect the store if the state changes, but there - you are connecting the store with state.models which you don't use. (if I understood correctly)

[max-mykhailenko]

I don't want connect all models, but I don't know how to run store function getInitialState (async in future) without that. Store must be with actual data for specified react components.

I can't pass one model by props because model will be get from all models that I load in getInitialState function.

I need mixin that just run getInitialState of my Store and fill information to models. Mixin that actualise information in my Store from DB or Globals.models and optional pass it to the component.

[gpbl]

If you are getting it async then it won't work, because when your state changes (after the async stuff), the getInitialState won't be called again. The data you want is already in this.state.models:

mixins: [Reflux.connect(AccessRightsStore, 'models')],

no need to use getInitialState. I'd do something like this:

app.ModelView = React.createClass({
    mixins: [Reflux.connect(AccessRightsStore, 'models')], // Store models to state
    render: function() {
       var model = _.find(this.state.models, { id: this.props.modelID }); // Find the model you need
       return <div>{model.id}</div>;
    }
);

[devinivy]

I suggest further conversation be made in our discussion repo (https://github.com/reflux/discuss). @spoike and others– if there's a well-defined feature request in here that I'm missing, we can certainly reopen.