3

tenho o seguinte objeto:

obj = {
  title: "obj1",
  tab: [{
     title: "titulo da tab 1",
     card: [{
        title: "card1",
        url: "url",
        image: "image"
     },
     { 
        title: "card2",
        url: "url",
        image: "image"
     }]

  },
  {
     title: "titulo da tab 2",
     card: [{
        title: "card3",
        url: "url",
        image: "image"
     },
     { 
        title: "card4",
        url: "url",
        image: "image"
     }]

  }
]

}

quando quero alterar o estado de uma variavel no react uso

setState({obj1: data})

quando quero alterar o estado de uma propriedade de um obj eu uso:

setState({obj1: {...this.state.obj1, title: "new title"} })

mas minha dificuldade é:

  • Como alterar o titulo de um card no obj?
  • Como alterar um titulo de tab no obj?

1 Resposta 1

3

Para estrutura largamente aninhadas eu acho preferível:

  • Replicar o estado num objeto local, de forma a preservar o original.
  • Alterar o que pretende nesse objeto
  • Chamar o setState com esse novo estado

Exemplo:

const novoEstado = Object.assign({}, this.state);
novoEstado.obj1.tab[1].card[0].title = 'Novo titulo de um card';
novoEstado.obj1.tab[0].title = 'Novo titulo para o primeiro tab';
this.setState(novoEstado);

O Object.assign replica o estado que tem num novo objeto, preservando o original e seguindo o que a documentação indica de não alterar o estado diretamente.

2
  • é this.state mesmo ou é this.state.obj1 ? na linha 1 Commented 13/08/2018 às 19:53
  • @JulioHenrique Foi lapso meu, não reparei que o estado tem como objeto raiz o obj1, mas a ideia é capturar o estado todo que é mais fácil. Vou ajustar
    – Isac
    Commented 13/08/2018 às 19:57

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .