Mostrar mensagem da validação do Yup JS na tela do usuário

29/04/2023

0

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

// 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

Francisco Miguel

Responder

Utilizamos cookies para fornecer uma melhor experiência para nossos usuários, consulte nossa política de privacidade.

Aceitar