 |
|
Você está aqui: React ::: Elementos de Formulários HTML ::: input type text Element/Object |
||
Como retornar o texto digitado em uma caixa de texto em React usando useState()Quantidade de visualizações: 633 vezes |
||
|
Nesta dica mostrarei como podemos retornar o texto digitado em um elemento HTML <input type="text"> ao clicarmos em um botão. Para isso nós faremos uso do gerencimento de estado proporcionado pelo objeto useState do React. Note que teremos dois estados: nome e nomeAtualizado, que estarão conectados às funções setNome() e setNomeAtualizado(). No momento que o texto é digitado na caixa de texto, automaticamente o estado nome é atualizado para corresponder ao contéudo exato do elemento HTML <input type="text">. Somente quando o botão é clicado é que transferimos o valor do estado nome para o estado nomeAtualizado, por meio de uma chamada à função setNomeAtualizado. Veja o código completo para o App.js:
E aqui está o código para o index.js:
Execute o exemplo e você verá uma caixa de texto <input type="text">, um botão <button> e dois elementos <h2>. Quando digitamos na caixa de texto, automaticamente o estado nome é atualizado. Ao clicarmos no botão, o estado nome é transferido para o estado nomeAtualizado, tudo isso é refletido de imediato na página. |
||
 Link para compartilhar na Internet ou com seus amigos: |
||
Veja mais Dicas e truques de React |
Dicas e truques de outras linguagens |
|
GNU Octave - Como calcular o coeficiente angular de uma reta em GNU Octave dados dois pontos no plano cartesiano |
E-Books em PDF |
||||
|
||||
|
||||
Linguagens Mais Populares |
||||
|
1º lugar: Java |
