v-for 和 v-if 优先级在vue2.x和vue3.x是相反的。

1、实践中，不应该将v-for和v-if放在一起

2、Vue2中，v-for的优先级是高于v-if，把他们放在一起，输出的渲染函数中可以看出会先执行循环再判断条件，哪怕我们只渲染列表中一小部分元素，也得在每次重渲染的时候遍历整个列表，这样会比较浪费性能；而在Vue3中则跟Vue2完全相反，v-if的优先级是高于v-for的，所以v-if执行时，它调用的变量哈不存在，会导致异常。

3、2种场景的应用：
（1）为了过滤列表肿的项目（v-for=”user in users” v-if=”user.isActive” ）。这种情况，我们可以使用计算属性，定义一个activeUsers，让其返回过滤后的列表即可（“users.filter(u => u.isActive)”）
(2)为了避免渲染本应该被隐藏的列表（v-for=”user in users” v-if=”shouldShowUsers”）。此时v-if移动到容器元素上（比如ul ol）或者外面包一层template即可

4、Vue文档明确指出v-if和v-for不要同事用在同一个元素上。