v-for有条件感，无

Question

我在其他问题中找不到我的问题的答案，因此决定发布我自己的问题。

首先，我知道您应该在遍历整个数组之前对它进行过滤。但就我而言，不是阵列本身给我带来了麻烦。

就我而言，我正在遍历一个包含产品的数组。这将渲染我的组件。现在，我要在每个xx产品中呈现一个在产品组件之间的促销文本。

所以我的代码：

<template v-for="(product, index) in products">
<product>
<promotion v-if="showOnIndex(index)">
</template>

现在我的问题是，这是走的路吗？当代码在每个产品后都显示为<!-- -->时，这是否会影响Google进行审核时计算出的节点数？有什么方法可以防止注释为空？

Answer 1

我认为您无法在v-if下更改错误条件的行为。您也可以检查原因thread。

如果使用v-show，您将删除空标签，但所有产品都有促销节点。

解决此问题的一种方法是为产品提供2个组件：

• 产品
• productWithPromotion

并使用:is在它们之间切换

<template v-for="(product, index) in products">
 <component :is="showOnIndex(index)? 'product' : 'productWithPromotion'" />
</template>