How can I update a state inside an array of object with Redux?

Question

My app has 2 tabs and I need to modify the content according the click in tab I have this state:

const example = {
  tabs: [
    {
      id: 111,
      title: 'Python',
      icon: 'Python@2x.svg',
      content: 'Hello World'
    },
    {
      id: 333,
      title: 'EQL',
      icon: 'EQL@2x.svg',
      content: 'Hello World 2'
    }
  ]
}

and I need to change the 'content' inside of tabs. I tried this:

return {
    ...state,
    tabs: {
      ...state.tabs,
      content: 'Uhuuuul'
    }
}

But this didn't work! Could someone explain why?

Answer 1

Use map :

return {
    ...state,
    tabs: state.tabs.map(tab => ({...tab, content: "Uhuuuul"}))
}