Usando o React Hook Form no form

Mostramos como enviar dados do formulário usando React Hook Form. Registramos os campos de nome, email e senha, e configuramos o handleSubmit para capturar e exibir os dados via console.log.

Comentários

(0)

Formulário dinâmico com React Hook Form e Zod

Seção 01 | Introdução

Apresentando o projeto

Por que React Hook Form e Zod?

Requisitos do Projeto

Setup do Projeto

Seção 02 | Deixando o form dinâmico

Botão de revelar senha

Máscaras de Input CEP, CPF e Telefone

Buscando Endereço e Cidade com o CEP

React Puro: dificuldades em implementar formulários

Seção 03 | React Hook Form

React Hook Form Instalação

Usando o React Hook Form no form

Loading e submetendo dados com RHF

Validação e exibição de erros individuais

Componente de erro do React Hook Form

Controlando inputs com o React Hook Form setValue

Validação customizada: senha e confirmação de senha

Corrigindo erros

Implementando validação da API (backend)

Seção 04 | Zod

Zod no React Hook Form usando resolvers

Criando o Schema no Zod

Validações do Zod no formulário

Seção 05 | Últimos Ajustes

React Hot Toast para um melhor feedback

Limpando o formulário após submissão

Seção 06 | finalização

Encerramento

Usando o React Hook Form no form

Comentários