我有这个代码设置

<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 属性的所有值都是“public”！

但在上面的代码片段中，继续运行的不是 if 块，而是 else 块。

如果我像这样重写代码：

<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>

然后就可以正常工作了。

第一个片段有什么问题？

看起来“key”属性在其中发挥了作用。是我使用方式不对吗？为什么会影响输出？

其中哪一个是在“for”循环内编写“if”语句的最正确方法？

我之前一直在代码中的其他循环中使用第一种方法，直到今天才出现问题。我是否需要将它们全部更新为类似于第二种方法以避免出现这样的奇怪行为？