Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

[Dúvida] Para que foi criado campo.setCustomValidity('Esse cpf não é valido')

Não consigo entender pra que foi criada esta parte de códigoe em qual situação esta menssagem vai aparecer?

durante o curso a gente coloca

campo.setCustomValidity('Esse cpf não é valido');

dentro de validação de CPF...

mas no final, quando o erro ocorre, aparece uma mensagem de const mensagems , e a menssagem 'Esse cpf não é valido' não aparece em momento algum.

2 respostas
solução!

Oii Anastasiia, tudo bem?

O método setCustomValidity é usado para definir uma mensagem de validação personalizada em um campo de formulário. No caso do código que você mencionou:

campo.setCustomValidity('Esse cpf não é valido');

Essa linha está definindo uma mensagem personalizada de erro para quando a validação do CPF falhar. No entanto, você mencionou que essa mensagem não está aparecendo e, em vez disso, está aparecendo uma mensagem de uma constante mensagens.

Isso acontece porque, no código do curso, a mensagem de erro que é realmente exibida para o usuário é definida no seguinte trecho de código:

tiposDeErro.forEach(erro => {
    if (campo.validity[erro]) {
        mensagem = mensagens[campo.name][erro];
        console.log(mensagem);
    }
})

Aqui, a mensagem de erro é obtida da constante mensagens com base no nome do campo e no tipo de erro.

Agora, você pode estar se perguntando: "Então, por que precisamos do setCustomValidity se a mensagem não é usada?".

Bem, o setCustomValidity faz mais do que apenas definir uma mensagem de erro. Ele também marca o campo de formulário como inválido. Isso significa que, se você tentar enviar o formulário, o navegador não permitirá enquanto o campo estiver inválido. Além disso, o método checkValidity retornará false para esse campo.

Então, mesmo que a mensagem definida com setCustomValidity não seja exibida diretamente, ela ainda está afetando a validação do campo de formulário.

Espero ter ajudado e bons estudos!

Nossa, Lorena, muito obrigada!! agora ficou claro!