Vue v-for 与 v-if

Question

我在Vue文档中发现了一些不一致的地方。如果有人澄清这一点，请。查看v-for-with-v-if它说这样做可能有用。在我的情况下，我处于那种确切的情况。但现在eslint正在抱怨。

所以我查看了样式指南，它告诉我要避免这种情况。所以有一些明显的矛盾。

问题：你应该避免它真的那么糟糕吗？

我的意见：我不认为它是bad。我有很多用例，这很有用。

Answer 1

方式一：

所有节点都将在每个 items[] 更改时呈现

<span v-for="item in items" v-if="item.shouldRender">...</span>

方式二：

所有节点都将被渲染一次

<template v-for="item in items">
    <span v-if="item.shouldRender">...</span>
</template>

方式3：

只会渲染过滤的节点。过滤的列表被缓存。

<span v-for="item in computedShouldRenderItems">...</span>

我认为'way-1'并不是很糟糕。但我宁愿避免它。