vue条件渲染v-if
在条件判断时的或与非
count:0
<div v-if='count<=10'>判断1:count的值为{{count}}</div>
<!--
and:&&, or:||,非:!= ,等于:==
-->
<div v-else-if='count>10 && count<15'>判断2:count的值为{{count}}</div><div v-else='count>=15'>判断2:count的值为{{count}}</div>
列表渲染v-for:
<div v-for='item in list1'>
<div v-if='item.grant==1' v-bind:style='vstyle'>
{{item.name}}有权操作!
</div>
<div v-else>
{{item.name}}无权操作!
</div>
</div>
new Vue ({
el:"#app",
data:{
count:0,
list1:[
{name:'张三',
group:'管理员',
grant:1
},
{name:'李四',
group:'操作员',
grant:2
}],
vstyle:{
color:'red',
textShadow:'0 0 5px #232323'
},
})