5 - List & Conditional rendering Flashcards
(6 cards)
Com quais tipos de dados pode ser usado o v-for?
Com arrays, com objetos e em range
Por que temos que usar o atributo :key com o v-for?
Esse atributo é utilizado para o Vue identificar de forma única cada item da lista quando o DOM precisa ser atualizado. O Vue faz isso para atualizar só o necessário, em vez de recriar tudo.
Quais as restrições de valores passados como argumento para o atributo key em um v-for?
O atributo key deve receber um número ou string única presente no conjunto de dados sobre o qual se está iterando. Dessa forma, não pode ser o index do próprio v-for ou um gerador de id externo, já que, desse modo, cada vez em que ocorrer uma nova renderização um novo valor vai ser atribuído como key para um mesmo item.
Por qual motivo não é recomendando usar v-if e v-for em um mesmo elemento?
Devido à precedência implícita do v-if. Para o vue o v-if tem uma prioridade maior que o v-for, de modo que caso ambos estejam presentes em um mesmo elemento, o v-if não terá acesso a variáveis no escopo do v-for, como a iteração da propriedade no loop, já que elas não foram definidas ainda.
Quais as diferenças entre v-if e v-show?
O v-if controla visibilidade condicional controlando a renderização de elementos de maneira lógica. Já o v-show controla visibilidade de elementos no DOM através da propriedade CSS display, demodo que o elemento sempre vai existir no DOM
Em termos de performance, como se comparam v-if e v-show?
Em geral o v-show é mais performático, já que não há o custo de tirar e colocar um elemento no DOM várias vezes. Entretando, o v-show também tem um custo de render inicial maior, já que um elemento controlado por v-if não é renderizado no DOM, até que a condição de controle seja avaliada como verdadeira.
