1

(I am a beginner, apologies for newbie question)

I have an array in my state (lets call it items = []). On dispatch of a certain action, I want to check if the array is empty or not. If the array is empty then load the array (using some middleware). My state in reducer looks like:

const INITIAL_STATE = {
  items: [],
  listIsEmpty: null
};

Following is the workflow that I am using at present to accomplish the above mentioned scenario (using react-redux):

(Pseudocode)

1--Check if the array (items) is empty:

S1. Dispatching in action (CHECK_IF_LIST_EMPTY) to check if the array is empty from my container.

S2. In reducer listening for this action, and checking if the state.items.length === 0.

S3. if(state.items.length === 0){state.listIsEmpty = true;}. Means if the items[] is empty, then set listIsEmpty = true.


2--Listening for the change in value of listIsEmpty:

S4. In my container check if(listIsEmpty === true), then dispatch an action RELOAD_LIST,

S5. In reducer listen for the action RELOAD_LIST, and on its dispatch load the list again (using middleware or something).

My question is that am I doing things the right way? Is there any easy way to do the same thing using react-redux?? Thanks.

Tajveer Singh Nijjar
  • 495
  • 6
  • 18
  • Best practice is to store the minimal possible state. You should avoid storing state that could be derived from other parts of the state. The reason is that for every piece of derived data you store in the state, you have to make sure it's kept up to date for every change to the original data. – Ben Lorantfy Sep 27 '18 at 04:27
  • https://stackoverflow.com/a/34373722/8896573 if you just want to look at the store during development, look at this answer.... it works – Joey Gough Sep 27 '18 at 11:21

0 Answers0