在vue2中当它们处于同一节点,v-for 的优先级比 v-if 更高,这意味着 v-if 将分别重复运行于每个 v-for 循环中。
如果你只想为部分项渲染节点时,这种优先级的机制会十分有用,但会浪费渲染性能,因为每次渲染前需要遍历整个数组去判断。
在vue3中当它们同时存在于一个节点上时,v-if 比 v-for 的优先级更高,这意味着 v-if 的条件将无法访问到 v-for 作用域内定义的变量别名。
总结:不推荐同时使用 v-if 和 v-for,因为这样二者的优先级不明显,推荐在外新包装一层 <template>
再在其上使用 v-for
解决