当他们同时存在时,v-if的优先级更高,所以v-for就不会渲染上

<!--这会抛出一个错误，因为属性 todo 此时没有在该实例上定义
-->
<li v-for="todo in todos" v-if="!todo.isComplete">{{ todo.name }}
</li>这里就会报错,因为v-for没有起作用

解决方法:在外先包装一层 <template> 再在其上使用 v-for 可以解决这个问题

<template v-for="todo in todos"><li v-if="!todo.isComplete">{{ todo.name }}</li>
</template>