Vai Na Web
O Vai na Web é um movimento de alta tecnologia e impacto social que amplia as capacidades humanas e requalifica a força de trabalho para encarar os desafios da Indústria 4.0.
Formulários
Revisão sobre objetos
Criando formulários no React
Agenda
Objetos
Coleções de propriedades, que podem adicionar propriedades a (e remover propriedades de) o que quisermos.
var usuario = {
nome: 'cicero',
gostos: ['jogar', 'jogar', 'jogar']
};Formulários
<form>
<label>
Usuario:
<input type="text" name="usuario" />
</label>
<input type="submit" value="Enviar" />
</form>html
render() {
return (
<form onSubmit={this.pegarEnvio}>
<label>
Usuário:
<input
type="text"
value={this.state.usuario}
onChange={this.pegarDado}
/>
</label>
<input type="submit" value="Enviar" />
</form>
);
}react
render!
recebe o dado...
muda o estado
exibe o estado
onChange={this.pegarDado}this.setState(){this.state.usuario}Normalmente o estado é mantido na propriedade state dos componentes e atualizado apenas com setState().
pegarDado = (event) => {
this.setState({
usuario: event.target.value
});
}Prevenindo o Reload da página ao clicar no submit
pegarEnvio = (event) => {
console.log('Usuário enviado : ' + this.state.usuario);
event.preventDefault();
}Vamos praticar?
Feedback é um presente
Referências
Até a próxima!
Formulários
By Vai Na Web
