如何在Redux中修改对象属性？

Question

Trying to create a really simple redux todo, almost there but got stuck on one thing.

export const completeTodo = (todo) => ({
  type: 'COMPLETE_TODO',
  data: {
    name: todo,
    complete: !todo.complete
  }
})

however, struggling to get the reducer working as I can't work out how to determine the exact object im working on

reducer:

case 'COMPLETE_TODO': {
   const chore = { ...state.chores, complete: action.data.complete}
   return { ...state.chores, chore };
}

and initialState is:

const initialState = {
  chores: [{name: 'cleaning', complete: false}]
}

obviously when i click my button is should be wired up so it can change the complete boolean to the opposite but only for that one todo

Answer 1

Since you have an array you need to replace it with a new one

case 'COMPLETE_TODO': {
      return {
        ...state,
        chores: state.chores.map(chore => 
         chore.name === action.data.name
         ? {...chore, complete: true /* or !chore.complete if you want toggle like behaviour*/}
         : chore)
      };
    }

and in your action creator

export const completeTodo = (todo) => ({
  type: 'COMPLETE_TODO',
  data: {
    name: todo.name // assumning names are unique
  }
})