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

Adaptando useErros e suas funções para o ESLinter.

Isto não é uma dúvida! Na verdade é uma solução de um problema que tive e decidi compartilhar aqui.

Durante o curso as seguintes funções foram criadas:

function criarEstadoInicial(validacoes) {
  const estadoInicial = {};

  for(let campo in validacoes) {
    estadoInicial[campo] = {valido: true, texto: “”};
}

  return estadoInicial;
}

e

function possoEnviar() {
    for(let campo in erros) {
        if(!erros[campo].valido) {
            return false;
}
}
return true;
}

Porém, se você assim como eu está usando o ESLinter, o seguinte erro vai aparecer.

“for..in loops iterate over the entire prototype chain, which is virtually never what you want. Use Object.{keys,values,entries}, and iterate over the resulting array.eslint(no-restricted-syntax)”

Basicamente o ESLint fala que: Fazer um for in loop é uma má prática nesse caso, seria melhor criar um array do objeto que você está usando e inteirar sobre ele.

Olhando agora essa mensagem é bem auto explicativa e literalmente te mostra a técnica que você deve usar, mas na hora não entendi muito bem o que ela queria dizer.

Então achei que seria uma boa ideia compartilhar aqui a solução para esse problema.

function criarEstadoInicial(validacoes) {
  const estadoInicial = {};

  Object.keys(validacoes).forEach((campo) => {
    estadoInicial[campo] = { valido: true, texto: "" };
  });

  return estadoInicial;
}

function possoEnviar() {
    return Object.values(erros).every((erro) => (erro.valido === true));
  }

Na função criarEstadoInicial queremos somente o nome das keys do objeto erros já que elas têm o mesmo nome do campo. O Object.keys() vai retornar o array com esses nomes, daí é só fazer um forEach “semelhante” ao que tínhamos antes para atribuirmos os nomes.

Na função possoEnviar() queremos verificar o valor de erro.valido, então só precisamos usar Object.values() e assim teremos um array só dos valores de erros (assim [{valido: boolean, texto: string}]), depois disso, temos que fazer a verificação usando o método every, dessa forma garantimos que todos os erro.valido sejam true.

2 respostas
solução!

Ótima solução Lucas! Tenho certeza que ajudará muitos alunos, parabéns pela solução extra :D

Valeu Mateus, vou marcar sua resposta como solução, para dar o tópico como resolvido.