May I use alt stores in multiple components in react?

Question

For example, in one page, I want to use UserStore in MANY Components. Is it okay to use that way?

If components are children of UserComponent, must I declare {...props} in every children?? or is it okay to use duplicate, overlay injection in many children components?
If components are out of UserComponent, is it okay to declare UserStore in many components duplicate?

What is best practice?

<Component1>
  <UserComponent>    < --- UserStore : get states to props
    <Component1 />

    <Component2>
      <Component3>
        <Component4>
          <Component5 /> < --- UserStore : get states to props
        </Component4>
      </Component3>
  </UserComponent>
</Component1>

<Component6>
  <Component7></Component7> < --- UserStore : get states to props
</Component6>

score 2 · Accepted Answer · answered Apr 14 '16 at 17:05

There are many lines of thought here. I'll admit that I haven't used alt.js, so there may be opinionated aspects that I don't address.

That said;

FB's Flux Documentation suggests a best practice around this. Their architecture suggestion is to use two categories of Components; Containers and Views.

Containers interact with stores to gather data, and receive no props. They have no view logic, and they pass the store data to child Views as props.

Views get all their information passed as props (no store communication).

So yes, you would pass these values down from child to child as props. But you can have multiple Containers that pull the same information from the stores. The important thing is that Containers should be agnostic about their own position and location, completely oblivious to who their own parents are.

May I use alt stores in multiple components in react?

1 Answers1