前端面试--v-for和v-if的优先级

在源码里，v-for优先于v-if被解析，也就是说v-for优先级更高，所以同时使用这两者的话，每次v-for循环时，都会执行一次v-if，比如循环一个有1000个元素的数组，那v-if也会被执行1000次，这样会十分消耗性能，降低代码质量。

在项目中应该怎么做？这里要根据判断条件是否和循环里的内容有关系，分两种情况：

第一种：

在v-if不依赖v-for中某个值的前提下，就是这个判断条件本身和循环出来的项没什么关系，可能只是用来判断这整个循环列表是否需要显示

这种情况我们可以在循环外层加一个template标签，在template标签里做v-if的判断，这样可以让v-if判断优先。

---

第二种：

当v-if的判断条件依赖于v-for的内容时（例如我们需要对每个循环项做判断，符合条件才展示）

针对这种情况，我们可以在computed计算属性里先做好判断，过滤出来符合条件的元素重新组成新的数组，在dom里循环这个新的数组

这时就不需要加v-if的判断了，因为我们已经在计算属性里把符合条件的项都取出来了。

我们要知道，在computed里过滤的成本远比用v-if的成本低得多。