Mostrar mensagem da validação do Yup JS na tela do usuário
Estou desenvolvendo um sistema bibliotecário, que conta com uma tela de cadastro de aluno e conta com o Yup para fazer a validação dos dados escritos no formulário
Como fazer para que estas validações, apareçam no front end para o usuário, caso aconteça algum erro no preenchimento do formulário
// Cria um novo Aluno async create(req, res) { const schema = Yup.object().shape({ email: Yup.string() .email("E-mail inválido") .required("Obrigatório preencher e-mail"), cpf: Yup.string() .matches( /^\d\.\d\.\d-\d$/, "CPF deve estar no formato xxx.xxx.xxx-xx" ) .required("Preencher Cpf é obrigatório"), telefone: Yup.string().required("Preencher Telefone é obrigatório"), endereco: Yup.string().required("Preencher Endereço é obrigatório"), nome: Yup.string().required("Preencher Nome é obrigatório"), sobrenome: Yup.string().required("Preencher Sobrenome é obrigatório"), senha: Yup.number().integer().required("Preencher Senha obrigatório"), }); let lista_erros = []; try { await schema.validate(req.body, { abortEarly: false }); const newAluno = await Aluno.create(req.body); return res.status(201).json(newAluno); } catch (e) { // Erros de campos não preenchidos if (e.name === "ValidationError") { const erros_validacao = e.inner.map((error) => ({ campo: error.path, mensagem: error.message, })); lista_erros = [...lista_erros, ...erros_validacao]; } // Erros de campos já existentes if (e.name === "SequelizeUniqueConstraintError") { if (e.fields.cpf) { lista_erros.push({ campo: "cpf", mensagem: "CPF já existente" }); } if (e.fields.PRIMARY) { lista_erros.push({ campo: "matricula", mensagem: "Matrícula já existente", }); } } return res.status(400).json({ error: "Erro", detalhes: lista_erros }); } }
Como fazer para que estas validações, apareçam no front end para o usuário, caso aconteça algum erro no preenchimento do formulário
Francisco Miguel
Curtidas 0