1
resposta

Erro ao digitar o v-for=" "

Qual o motivo desse erro ? Preciso de um apoio.. por favor

{{titulo}}

  <ul>
    <li v-for="foto in fotos">             (((((mesmo que o use v-for"foto of fotos"))))))))
      <img :src=" foto.url " :alt=" foto.titulo ">
    </li>
  </ul>
1 resposta

Oi Emanuel, qual o erro? Por favor copie o erro que aparece para você ao tentar rodar esse código.

Uma possibilidade, se você estiver usando Vue 3, é que para a diretiva v-for o Vue agora demanda que você também adicione atributo key. Esse atributo é uma chave que você define, mas deve ser única para cada item que esteja sendo iterado. Ela é usada pelo Vue (acredito) por razões de performance ao manipular o DOM.

O código ficaria assim:

  <ul>
    <li v-for="foto in fotos" :key="foto.titulo">
      <img :src=" foto.url " :alt=" foto.titulo ">
    </li>
  </ul>

Observação: para o exemplo do curso tudo bem usar titulocomo chave, mas o ideal é usar um identificar único que certamente não será repetido (duas fotos podem ter o mesmo título).

Essa é só uma possibilidade do que pode ser o erro, mas se você adicionar a mensagem de erro mostrada à sua pergunta, posso verificar.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software