J'ai cette configuration de code

<div v-for="person in persons">
    <div v-if="person.status == 'public'" :key="person.id">
        Hi,my name is {{person.name}}
    </div>
    <div v-else :key="person.id">
        This person is private
    </div>
</div>

person 对象中的 status Toutes les valeurs des propriétés sont "publiques" !

Mais dans l’extrait ci-dessus, ce n’est pas le bloc if 块，而是 else qui continue de s’exécuter.

Si je réécris le code comme ceci :

<div v-for="person in persons" :key="person.id">
    <div v-if="person.status == 'public'">
        Hi,my name is {{person.name}}
    </div>
    <div v-else>
        This person is private
    </div>
</div>

Ensuite, cela fonctionnera normalement.

Qu'est-ce qui ne va pas avec le premier clip ?

On dirait que l'attribut "clé" joue un rôle à cet égard. La façon dont je l'utilise est-elle mauvaise ? Pourquoi cela affecte-t-il le rendement ?

Laquelle de ces méthodes est la manière la plus correcte d'écrire une instruction « if » dans une boucle « for » ?

J'ai déjà utilisé la première méthode dans d'autres boucles de mon code et je n'ai eu aucun problème jusqu'à aujourd'hui. Dois-je tous les mettre à jour pour qu'ils soient similaires à la deuxième méthode afin d'éviter un comportement étrange comme celui-ci ?