0

I am working on an app using React with Alt flux implementation. Currently, I'm trying to figure out the best way to use data from multiple Alt stores to compose a request to the backend.

Say, I have a SheetDataStore, FiltersStore and a fetchFilteredData method in my DataSource file. To get proper data from backend, i need to pass to fetchFilteredData both some sheet data and filters, but when you call the fetchFilteredData method from one of the stores, you can pass some arguments and the state of just that exact store.

So i see 2 ways of handling this case:

1) I make 2 actions: prepareFilters and fetchData. The prepareFilters is called from a component and gets handled by FilterStore, which prepares all required data and after that calls fetchData action, passing the prepared data as an argument. The SheetDataStore handles the fetchData action and calls the fetchFilteredData having all required data now.

What i don't like here is that it seems to me, Stores should not be calling actions, so that's kind of a hacky solution.

2) I import FilterStore to the SheetDataStore and use FilterStore.getState() inside of one of SheetDataStore methods to get all the data i need. That seems easy, but there might be some pitfalls of coupling the stores like that.

Are there any best practices for such a case? Maybe some of you faced similar issue and can recommend which of the paths to take from your experience?

Gleb Kostyunin
  • 3,743
  • 2
  • 19
  • 36

1 Answers1

1

Do the binding in the component. Say you have FilterComponent then pass the search action SheetDataAction.search to it: <FilterComponent search={SheetDataAction.search} />

And in the FilterComponent.render() do something like <button onClick={() => this.props.search(this.props.criteria)} />

sax
  • 808
  • 1
  • 12
  • 25
  • Fair point, but in this case, you'll need to have all the data available in the component, which i don't have. In short, i decided to go with the second option i mentioned in my question and it's working for me. – Gleb Kostyunin Jul 15 '16 at 09:15