Nesta dica mostrarei como podemos usar useRef() para criar uma referência para um elemento HTML <input type="text">. Em seguida nós vamos usar a propriedade current.value para retornar o conteúdo da caixa de texto e atualizar o estado nomeAtualizado, criado a partir da função useState().
Este código, embora simples, é o ponto de partida para aplicações React bem interessantes, pois não fazemos uso do evento onChange das caixas de texto para atualizar o estado da aplicação. Isso, como é fácil de se perceber, economiza os recursos gastos em processamento desnecessário.
Veja o código para App.js:
Este trecho de código ou resolução de exercício faz parte do Super Pack 12.000 Dicas e Truques de Programação e 1.500 Exercícios Resolvidos em Java, Python, VisuAlg, Portugol, Delphi, C#, C, C++, VB.NET, Golang, Pascal, Ruby, PHP, e várias outras linguagens.
Aprenda a programar resolvendo problemas do mundo real. Tudo em português, com comentários em português.
Quero Ser Apoiador(a) |
E aqui está o código para o index.js:
Este trecho de código ou resolução de exercício faz parte do Super Pack 12.000 Dicas e Truques de Programação e 1.500 Exercícios Resolvidos em Java, Python, VisuAlg, Portugol, Delphi, C#, C, C++, VB.NET, Golang, Pascal, Ruby, PHP, e várias outras linguagens.
Aprenda a programar resolvendo problemas do mundo real. Tudo em português, com comentários em português.
Quero Ser Apoiador(a) |
Execute a aplicação React, digite um nome na caixa de texto e clique o botão Atualizar Estado. Somente neste momento é que o conteúdo da caixa de texto será transferido para o estado nomeAtualizado e refletido no elemento <h2>.
|
Link para compartilhar na Internet ou com seus amigos:
