react Reducer - overwriting item but instead a double is generated

Question

i want to change the existing item with following function, but instead of overwriting a new item will be created. Whats my mistake ?

  case "EDIT_KSTORY":
  return state.map((storie) => {
    if (
      storie.stories.storieID === action.sID &&
      storie.aNoteId === action.aNid
    ) {
      return {
        ...storie,

        stories: [
          ...storie.stories,
          {
            ...action.updates,
          },
        ],
      };
    } else {
      return storie;
    }
  });

Which item are you trying to overwrite? – WebbH Dec 06 '21 at 22:57 — WebbH, Dec 06 '21 at 22:57

score 0 · Answer 1 · answered Dec 07 '21 at 05:05

0

try not to mutate all states, and mutate only in places where a data should be changed. I don't know all structure, move but might be:

case "EDIT_KSTORY": 
return {
    ...state,
    stories: state.stories.map((storie) => {
        if (
          storie.stories.storieID === action.sID &&
          storie.aNoteId === action.aNid
        ) {
          return {
            ...storie,
    
            stories: [
              ...storie.stories,
              {
                ...action.updates,
              },
            ],
          };
        } else {
          return storie;
        }
      });
}

answered Dec 07 '21 at 05:05

Anna Vlasenko

916
5
8

Thanks for that hint, but is not working – Maxxxus Dec 07 '21 at 08:11
and it won't be, you need to re-structure your reducer in separate objects, and update exactly the part you need. But don't mutate all state as state.map(....) – Anna Vlasenko Dec 07 '21 at 09:48

react Reducer - overwriting item but instead a double is generated

1 Answers1