vue的v-for和v-if在同一个标签内无法同时使用的问题

vue中我们遍历一个列表for循环是作用在dom节点上的，

我们在遍历列表的时候可能需要进行判断哪些显示哪些隐藏

1、错误代码如下，这样写的话，我们编辑器也会告诉你不能这样写

<ul>
    <li 
        v-for="item in list" 
        v-if="item.isActive" 
        :key="item.id"
         >
        {{item.name}}
    </li>
</ul> 

2、分析原因：当 Vue 处理指令时， v-if 比 v-for 具有更高的优先级，v-if无法访问v-for里面变量

3、代码修正

（1）使用空标签 template，让for循环在template上面

<ul>
    <template v-for="item in list" >
        <li v-if="item.isActive" :key="item.id">
            {{item.name}}
        </li>
    </template>
</ul>