Nicolas Blanco
Nicolas Blanco

Reputation: 11299

How to decide which container should be responsible to fetch data?

Let's say I've got a React + Redux application.

I got actions to fetch data from an API.

I've got multiple containers that need to have some data from the same API endpoint (so I need to dispatch the same action).

All those containers have the same importance and priority and are displayed at the same time on the page.

How to decide which container should be responsible to dispatch the action to get the data?

Should it be random (I guess not), is there a convention or library to help?

Upvotes: 1

Views: 107

Answers (2)

nick
nick

Reputation: 489

I am also a newbie to react+Redux. Hope my idea could help you a little bit.

You mentioned your containers have the same importance and will be on the page at the same time. then I assume they are on the one single page.In this case. I will put all actions at the very top level.

The simplest case. Let's say you are trying to make a question editor. In this page:

It has a container to deal with the preview of questions called

<QuestionPreviewer >

It has a container to deal with editing questions called

<QuestionAuditingForm />.

And, you have some actions like 'DELET_QUESTION' 'SAVE_CHANGED'... and you want them can be triggered at any of those components.

In this case, I will wrap all the actions In the component

<QuestionEditorContainer /> 

as functions. And in this container, I will distribute all the data and these functions (with dispatch actions) from redux to its children

<QuestionPreviewer /> and <QuestionAuditingForm /> 

as props. In this case, your two children component become a very pure component and the whole module will become easier to be maintained.

So my point is, put everything (actions, data) in their top level component of the module. It saves you a lot of time to maintain.

Hope this could be of help and I am happy if anyone would like to correct me if I made anything wrong.

Upvotes: 1

Supritha Rao
Supritha Rao

Reputation: 26

Can you create a parent container to take care of dispatching the action?

Also, without knowing your exact use case - if all containers are of equal priority and are loaded together, picking a random container to dispatch action should also be ok.

Upvotes: 0

Related Questions