React Reducer – Add elements to existing element

November 29, 2021

i want that new updates get continuous added to "kanbanboard" but instead the old value get signed over. enter image description here

ACTION-Function

  export const editExpense = (id, updates) => ({
  type: "EDIT_EXPENSE",
  id,
  updates
});

REDUCER-FUNCTION

case "EDIT_EXPENSE":
  return state.map((expense) => {
    if (expense.id === action.id) {
      return {
        ...expense,
        kanbanboard:[{...action.updates}]
      };
    } else {
      return expense;
    };
  });

Thank you for helping.

>Solution :

I cant see the entire reducer but it looks like you are explicitly overriding the old value. Change it to:

case "EDIT_EXPENSE":
  return state.map((expense) => {
    if (expense.id === action.id) {
      return {
        ...expense,
        kanbanboard:[
         ...expense.kanbanboard, // you have to add your old state here
         { 
           ...action.updates
        }]
      };
    } else {
      return expense;
    };
  });