首先:永远不要把 v-if
和 v-for
同时用在同一个元素上。
其次:当 Vue 处理指令时,v-for
比 v-if
具有更高的优先级,这句话代表着,当v-if和v-for同时出现。渲染函数会先执行到v-for。我们的本意是根据用户权限来控制是否显示一个列表。但是如果代码如上的话v-if实际上是执行到了列表渲染的每一项。
如果遇到这种需求的话我们建议的写法是:
<div v-if = 'flag'>
<div v-for='(item) in lcList' :key='item.id' >
</div>
如果遇到必须写一起的话建议写法:
<div v-for='(item) in lcList' :key='item.id' v-if='item.userName'>