Vue.js 我可以在同一个div上创建一个条件v-for循环到循环吗？

我很好奇有没有一种方法可以让v-for循环中包含一个条件语句，这样我就可以减少程序中的冗余。如果

标记过滤器

对象不存在，我有一个div标记需要在

标记过滤器

对象上循环，否则，我需要它在

标记过滤器

对象上循环

这是我当前循环的一个片段：

<div v-else class="text-left mt-2 border" v-for="(filter, index) in tagfilters" :key="index">
         <span v-for="(f, i) in filter" :key="i">
         <div class="d-flex justify-content-between align-items-center pr-3 pl-3 pt-3">
                  <!-- Multiselect Search with Tagging -->
                  <div>
                     <multiselect @change="onEdit(filter, 'code', f.code)" class="mb-2" v-model="f.code" placeholder="Search & Select Code Options" :custom-label="customCodesLabel" track-by="code" :options="codesArr"></multiselect>
                 </div>
         </div>
</div>

这可能吗？

一个选项是使用，但不确定是否足以满足您的需要：

get realTagFilters() {
    return this.tagFilters ?? this.tag_filters;
}

你可以这样称呼它

<div v-for="(filter, index) in realTagFilters">

---

或者您可以尝试使用，这似乎也很有效：

<div v-for="filter in (tag_filters || tagFilters)" :key="filter.id">

根据Vue.js

不建议同时使用v-if和v-for。有关详细信息，请参见《样式指南》

您可以使用computed属性来获取正确的列表

newvue({
el:“应用程序”，
数据：函数（）{
返回{
标签过滤器：{
过滤器C:“标记过滤器C.”，
过滤器D:“标记过滤器D.”，
},
标记过滤器：{
过滤器：“tagfilter A.”，
过滤器B:“标记过滤器B.”
}
}
},
计算：{
getTagFilters（）{
if（Object.keys（this.tag_过滤器）.length==0）{
返回此.tagfilters；
}否则{
返回this.tag_过滤器；
}
}
}
})

{{filter}}
删除标记过滤器数据

要尝试使用计算方法，确实需要数组。v-for=“（过滤器，索引）在当前过滤器中”。计算：{'current_filters'：函数（）{return tag_filters？tag_filters:tagfilters}}，

<div v-for="filter in (tag_filters || tagFilters)" :key="filter.id">