Resumo do Transcript

Vamos dar a revisada aqui. Pode... Deixa eu tirar esses aqui. Dar a revisada. Primeira coisa. Event.targetValue vai ser banana, maçã ou morango. Vai ser substituído aqui como o propriedade ou a chave desse objeto. E o valor vai ser o valor invertido da fruta em castão. Você cria um copy do estado das frutas. E adiciona nova propriedade que a gente definiu. E depois seto state com frutos nilfrutos. Na hora de que a gente vai ter um problema, porque eu nomeei maçã aqui sem o cedilha e... e eu... a... coisa aqui. Então, talvez eu vou modificar esse valor, ou eu posso modificar esse cara para ser maçã assim. Entendeu? Vamos ver o erro aqui. O que é que aconteceu? Value not defined, sei o que... Ah, desculpa. Tinha que voltar esse cara. Destruturamento. Event.targetValue Pode fazer esse aqui também. Tirar e botar esse cara. Tá bom? Banana funcionou. Morango funcionou. Maçã não funcionou. Por causa daquilo que eu falei. Então, se eu botar maçã com o cedilha e o tílilha clicar funcionou. Tá bom? Tem que fazer... essa chave aqui tem que ser a mesma do valor aqui, senão não vai funcionar. Então, agora vamos dar um console logo para ver se tudo deu certo, como theStateFruit A gente aprendeu que não pode usar o destruturado, porque esse destruturado aqui, se referiu ao estado anterior que vai setar um novo estado. Essa referência tá se referindo ao estado anterior mas a gente quer dar um console logo da referência atual. Tem que dar o desisteito da fruta, não pode deletar. Tá bom? Tem que ter. Então, vamos dar maçã tru maçã pode clicar maçã, tru, morango fos. tudo tru tiram banana, tiram maçã, tiram morango, tudo legal. Então, é assim que a gente faz checkbox and react mas ainda tem uma coisa mais que eu quero te dizer para dar um refactoring nesse object assigned. Você pode usar o operador de spread chamado ponto, ponto, ponto fica muito mais fácil. O ponto, ponto, ponto serve para copiar a propriedade de um objeto. Nesse caso, eu quero copiar todas as propriedades de frutas e adicionar essa nova propriedade aqui, desse objeto. Você pode fazer assim. Em vez de object assigned você faz um object e copia as propriedades da fruta e adiciona um new value object. Fica muito mais fácil. Não precisa dar object assigned. Você note a diferença. Então, ponto, ponto, ponto vai copiar todas as propriedades desses objetos chamado frutas e adicionar a nova propriedade que está dentro do objeto new value object. Nesse caso, pode ser banana, maçã ou morango com o valor de true ou false. Dependendo do valor aqui. Então, o factory aqui fica muito mais legal. Vamos ver se não deu problema. Opa! O que aconteceu? Ah, desculpa. O problema é que esse new value object, a gente tem que tirar esse negócio aqui. Porque aqui já é um objeto. Nesses casos, os 3 pontos vai copiar as propriedades. Mas aqui você está botando um objeto dentro de outro objeto, mas sem um palavra chave. Por isso que está dando erro. Dando um problema. Então, a gente vai pegar esse cara aqui e copiar para dentro desse cara aqui. Tá bom? Vamos fazer duas maneiras. Você pode usar esse new value assim. Muda para new value. Vou recortar essa parte. Esse new value vai ser invertido da frutas value. E aqui, em vez de new value object, você põe aqui, que é value, 2 pontos new value. Tá bom? Tem um objeto essa aqui, a chave desse propriedade. E que é o valor da propriedade, que é frutas sub value, que pode ser banana ou qualquer coisa. Vai ser 2 op false, booleano, invertido. Agora vai funcionar. Tá bom? E entendeu? Agora funciona. São detalhes. Então, o objeto está saindo, o objeto vazio com objeto que é copiar as propriedades e um novo objeto para setar as now propriedades. Dessa maneira entendeu? Mas aqui, usando o spread, operador spread, muito mais conveniente. Copia as propriedades frutas, adicione esse now propriedade ou modifique essa propriedade. Tá bom? Por isso é só por esse vídeo é só e até o próximo vídeo.