v-if、v-else,v-if-else,v-show
v-if、v-else,v-if-else渲染时只渲染满足条件的一条
v-show 只有ture和flase两个值,通过控制display来控制
条件判断语句写在html中例
<div id="app">
<div v-if="score>=90">优秀</div>
<div v-if-else="90>score&&score>=80">良</div>
<div v-if-else="80>score&&score>=60">一般</div>
<div v-else>很差</div>
</div>
<script>
var vm=new Vue({
el:"#app",
data:{"
score:99
},
methods:{
}
})
</script>
循环结构
v-for
如果数组包含的是对象数据,则插值表达式中用name.来输出
key的作用
帮助vue提供性能,可以用name.id,或者用index
遍历数组
<ul>
<li v-for=”(name,index) in arr">{{name+" “ +index}}</li>
</ul>
<script>
var vm=new Vue({
el:"#app",
data:{
arr:["1","2","3"]
},
methods:{ }
})
</script>