how to replace array data in redux?

Question

I need to replace some data in an array with new ones from another array. I performed a loop in which I removed words from certain values to lowercase. Now I want to update the data, but for some reason it does not update.

const initialState = {
    list: []
};


case Constants.dataNodes.success: {
            const newState = { ...state };

            newState.list = [...newState.list, ...action.payload];


            const filterFQDN = [];

            for (let i = 0; i < newState.list.length; i++) {
                filterFQDN.push(newState.list[i].fqdn.toLowerCase());
            }

            for (let a = 0; a < newState.list.length; a++) {
                for (let b = 0; b < filterFQDN.length; b++) {
                    if (filterFQDN[b] === newState.list[a]) {
                        return newState.list = [...newState.list[a].fqdn, ...filterFQDN[b]];
                    }
                }
            }
          
        }

I guess what's throwing me off is the return in the double-nested for-loop, you seem to be missing a return. Is that the intended value you want returned in the reducer? or are you trying to iterate over the data more and update more elements? Can you be a bit more explicit in what you are trying to accomplish? — Drew Reese
– Drew Reese, Commented Aug 11, 2020 at 7:42
there are objects in the newState.list array with fqdn value which I need to lowercase. in a loop, I first take all the values and store them in lowercase into a new array. after I want to replace the values from the new array in the state — Aleksf
– Aleksf, Commented Aug 11, 2020 at 7:52
So you simply want to copy the old array, add data, and lowercase all the elements' fqdn property? — Drew Reese
– Drew Reese, Commented Aug 11, 2020 at 7:54
the original goal is to lowercase the elements of fqdn. Yes, I want to replace the state with new data — Aleksf
– Aleksf, Commented Aug 11, 2020 at 7:57

Drew Reese · Accepted Answer · 2020-08-11 08:01:40Z

1

You can shallow copy existing state, then shallow copy the existing state.list into a new array and append the payload to the end. Map this new array to another array where you can toLowerCase() the fqdn property.

case Constants.dataNodes.success: {
  const newState = {
    ...state,
    list: [...state.list, ...action.payload].map((el) => ({
      ...el,
      fqdn: el.fqdn.toLowerCase()
    }))
  };
}

Since you start with an empty array you should only need to toLowerCase the new data coming in though, so you can map the payload instead of the entire state array each time.

case Constants.dataNodes.success: {
  const newState = {
    ...state,
    list: [
      ...state.list,
      ...action.payload.map((el) => ({
        ...el,
        fqdn: el.fqdn.toLowerCase()
      }))
    ]
  };
}

answered Aug 11, 2020 at 8:01

Drew Reese

207k20 gold badges282 silver badges293 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Aleksf Over a year ago

Thank you for your answer. In this case, the register changes and is displayed correctly, but when searching, it sees only if you enter in the top.

Collectives™ on Stack Overflow

how to replace array data in redux?

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related