S
S
Stanislav2018-03-30 00:26:06
React
Stanislav, 2018-03-30 00:26:06

React + Redux: How to use the same component multiple times at the same time?

Let me explain. There is a page, let's say a component is called on it three times, which should show a different set of the same type of data each of the three times. Let's say it will be three different lists of companies. The component is connected locally, in the sense that its state is managed at the level of this component, through the decorator @connect. The code for the parent component is something like this:

<main className="main">
  <Promo />
  <Companies
    type="type1"
  />
  <News />
  <Testimonials />
  <Benefits />
  <Companies
    type="type2"
  />
  <Sections />
  <Companies
    type="type3"
  />
</main>

Accordingly, the component has its own actions, its own state, its own reducer, and all this is called three times each time the component is called from the main page, while in each such call a parameter is passed that specifies the type of companies, and, accordingly, these companies are fetched three times from the API service.
The problem is that by changing the state of this component and saving data in state through redux, it is not clear how to save three types of this data without overwriting the rest and at the same time waiting for each type of such data to load. More precisely, it is not clear which path is the right one here, the very right way, so that the code would continue to be easy to maintain, use and transfer to other people for support.

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question