v-if和v-for哪个优先级更⾼？

v-if和v-for哪个优先级更⾼？

分析：

此题考查常识，⽂档中曾有详细说明v2|v3；也是⼀个很好的实践题⽬，项⽬中经常会遇到，能够看出⾯试者api熟
悉程度和应⽤能⼒。

思路分析：

1. 先给出结论
2. 为什么是这样的，说出细节
3. 哪些场景可能导致我们这样做，该怎么处理
4. 总结，拔⾼

回答范例：

1. 实践中不应该把v-for和v-if放⼀起。
2. 在vue2中，v-for的优先级是⾼于v-if，把它们放在⼀起，输出的渲染函数中可以看出会先执⾏循环再判断条。
   件，哪怕我们只渲染列表中⼀⼩部分元素，也得在每次重渲染的时候遍历整个列表，这会⽐较浪费；另外需要。
   注意的是在vue3中则完全相反，v-if的优先级⾼于v-for，所以v-if执⾏时，它调⽤的变量还不存在，就会导致异常。
3. 通常有两种情况下导致我们这样做：
   为了过滤列表中的项⽬ (⽐如 v-for=”user in users” v-if=”user.isActive” )。此时定义⼀个计算属性 (⽐如 activeUsers )，让其返回过滤后的列表即可（⽐如users.filter(u=>u.isActive) ）。
   为了避免渲染本应该被隐藏的列表 (⽐如 v-for=”user in users” v-if=”shouldShowUsers” )。此
   时把 v-if 移动⾄容器元素上 (⽐如 ul 、 ol )或者外⾯包⼀层 template 即可。
4. ⽂档中明确指出永远不要把 v-if 和 v-for 同时⽤在同⼀个元素上，显然这是⼀个重要的注意事项。
5. 源码⾥⾯关于代码⽣成的部分，能够清晰的看到是先处理v-if还是v-for，顺序上vue2和vue3正好相反，因此产⽣了⼀些症状的不同，但是不管怎样都是不能把它们写在⼀起的。

v2：https://github1s.com/vuejs/vue/blob/HEAD/src/compiler/codegen/index.js#L65-L66

v3：https://github1s.com/vuejs/core/blob/HEAD/packages/compiler-core/src/codegen.ts#L586-L587