Vue中 v-vif 与v-for 的问题

Vue中针对于v-if与v-for的使用可能会有一些疑问，比如两者在同一级时，谁的优先级比较高，应该这样去处理会更好。
首先我们看vue中的源码：

源码中对于v-for的执行先与v-if，因此v-for的优先级高于v-if的优先级。
因此当两者在同一级一起使用时，会出现性能方面的问题，因为不管你的v-if里的语句是否为true，都会先执行v-for去循环。
要避免这种情况，可以在外面嵌套一层template，在这一层去做判断，然后在内部进行v-for循环。
还有一种情况，比如判断的条件是循环项的值，为了避免那些不用渲染的去执行循环遍历，浪费性能，可以在计算属性中先对数据进行处理，剔除掉不需要循环的部分。