（还好吧）v-if和v-for的优先级

优先级：

v-for优先级比v-if高

注意事项：

永远不要把 v-if 和 v-for 同时用在同一个元素上，带来性能方面的浪费（每次渲染都会先循环再进行条件判断）
如果两者同时出现的话，那每次循环都会执行v-if，会很浪费性能，我们正确的做法应该是再v-for的外面新增一个模板标签template，在template上使用v-if，代码如下：

<div>
	<template v-if="isShow">
		<p v-for="item in list">
	</template>
</div>
<script>
export default {
  name: "Home",
  components: {},
  data () {
    return {
      list:[
         { title: "foo" },
         { title: "baz" }
      ]
    }
  },
  computed: { 
  	isShow() { 
  		return this.items && this.items.length > 0 
  	}
  }
};
</script>

3.  如果在循环内部进行if判断，我们可以先用computed过滤出有效的展示数据，再进行渲染，代码如下图所示：