Atualizações de estado em React com objetos aninhados precisam de cuidado

Muita gente ainda cai na armadilha de atualizar objetos no React usando a técnica tradicional de mutação direta, como user.age = 22 e depois fazer setUser({ user }). Isso é um erro comum que pode fazer seu estado não refletir as mudanças corretamente.

React não detecta mudanças em objetos mutados diretamente por causa da sua comparação superficial. Então, mesmo que seu valor tenha mudado, o componente pode não atualizar, gerando bugs difíceis de rastrear. A decisão fica mais saudável quando o time consegue medir o impacto depois. Sem esse critério, a solução pode parecer simples no começo e cara no suporte.

O melhor caminho é sempre usar uma atualização imutável. Ou seja, criar uma nova cópia do objeto com as alterações necessárias usando spread (...) ou funções específicas de imutabilidade.

Exemplo prático:

const [user, setUser] = useState({ name: 'M', age: 21 }). // Atualizar a idade corretamente
setUser(prev => ({ ...prev, age: 22 })). 

Assim, você garante que React reconhece a mudança e realiza a renderização adequada.

No seu código, a tentativa de fazer setUser({ user }) ao invés de passar o objeto atualizado direto é um erro clássico. Você não está passando a nova versão do objeto, só um objeto que contém o antigo. Esse contexto ajuda a separar ganho real de novidade difícil de sustentar. A decisão fica mais saudável quando o time consegue medir o impacto depois. Sem esse critério, a solução pode parecer simples no começo e cara no suporte.

A pergunta é: você costuma usar funções de atualização baseadas no estado anterior? Ou ainda cai na tentação de mutar direto e fazer uma cópia manual depois? A decisão fica mais saudável quando o time consegue medir o impacto depois. Sem esse critério, a solução pode parecer simples no começo e cara no suporte. O valor aparece melhor quando operação, produto e engenharia olham para o mesmo risco. Por isso, o recorte precisa considerar manutenção, validação e caminho de volta. Esse contexto ajuda a separar ganho real de novidade difícil de sustentar.

Se a sua rotina envolve objetos complexos ou aninhados, vale a pena investir em utilitários de imutabilidade ou até mesmo bibliotecas como Immer, que facilitam esse trabalho. Sem esse critério, a solução pode parecer simples no começo e cara no suporte. O valor aparece melhor quando operação, produto e engenharia olham para o mesmo risco. Por isso, o recorte precisa considerar manutenção, validação e caminho de volta. Esse contexto ajuda a separar ganho real de novidade difícil de sustentar. A decisão fica mais saudável quando o time consegue medir o impacto depois. Sem esse critério, a solução pode parecer simples no começo e cara no suporte.