Executando verificação de segurança...
-5

Ajuda em Foreach!

Pessoal, poderiam me ajudar neste código? Não compreendi qual erro está dando e porque. O console acusa um erro no forEarch, alegando que o mesmo não se trata de uma função. Já tentei resolver de diversas formas e nada.

Segue uma print do erro e posteriormente o código todo:
https://files.fm/u/suz7d6za2s

Código inteiro:
export class GithubUser { static search(username) { const endpoint = https://api.github.com/users/${username}`

return fetch(endpoint)
  .then(data => data.json())
  .then(({ login, name, public_repos, followers }) => ({
    login,
    name,
    public_repos,
    followers
  }))

}
}

// classe que vai conter a lógica dos dados
// como os dados serão estruturados
export class Favorites {
constructor(root) {
this.root = document.querySelector(root)
this.load()
}

load() {
this.entries = JSON.parse(localStorage.getItem("@github-favorites:")) || []
}

delete(user) {
const filteredEntries = this.entries.filter(
entry => entry.login !== user.login
)

this.entries = filteredEntries
this.update()

}
}

// classe que vai criar a visualização e eventos do HTML
export class FavoritesView extends Favorites {
constructor(root) {
super(root)

this.tbody = this.root.querySelector("table tbody")

this.update()

}

update() {
this.removeAllTr()

this.entries.forEach(user => {
  const row = this.createRow()

  row.querySelector(
    ".user img"
  ).src = `https://github.com/${user.login}.png`
  row.querySelector(".user img").alt = `Imagem de ${user.name}`
  row.querySelector(".user p").textContent = user.name
  row.querySelector(".user span").textContent = user.login
  row.querySelector(".repositories").textContent = user.public_repos
  row.querySelector(".followers").textContent = user.followers

  row.querySelector(".remove").onclick = () => {
    const isOk = confirm("Tem certeza que deseja deletar essa linha?")
    if (isOk) {
      this.delete(user)
    }
  }

  this.tbody.append(row)
})

}

createRow() {
const tr = document.createElement("tr")

tr.innerHTML = `
  <td class="user">
    <img src="https://github.com/maykbrito.png" alt="Imagem de maykbrito">
    <a href="https://github.com/maykbrito" target="_blank">
      <p>Mayk Brito</p>
      <span>maykbrito</span>
    </a>
  </td>
  <td class="repositories">
    76
  </td>
  <td class="followers">
    9589
  </td>
  <td>
    <button class="remove">&times;</button>
  </td>
`

return tr

}

removeAllTr() {
this.tbody.querySelectorAll("tr").forEach(tr => {
tr.remove()
})
}
}`

Carregando publicação patrocinada...
2

Olá.

Algumas dicas para melhorar suas chances de conseguir ajuda.

  • Dê mais contexto sobre o problema. Explique o ambiente em que está rodando o seu código.
    Me parece que o código é TypeScript. Em que ambiente ou framework está executando isso.

  • Qual parte do seu código, inicia o fluxo que causa o problema?

Sobre o seu problema:

Aqui está um exemplo de uso do forEach em typescript: https://www.tutorialspoint.com/typescript/typescript_array_foreach.htm

Se está tendo erro ao chamar forEach, pode ser que o objeto apartir do qual está invocando o forEach, não seja um objeto iterável. Isso pode ser verificado, simplesmente criando um breakpoint e colocando o mouse sobre a variável "this.entrie".

Outra coisa, a imagem que você incluiu, só está exibindo um X vermelho. O mais importante, que é a mensagem de erro impressa no console, não está disponível.