1.2.4 V-IF和のV-について
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF‐8">
<title>Document</title>
<script src="/js/vue/vue.min.js"></script>
</head>
<body>
<div id="app">
<ul>
<!‐‐只显示偶数行‐‐>
<li v‐for="(item,index) in list" :key="index" v‐if="index % 2==0">{{index}}‐{{item}}
</li>
<li v‐for ="(value,key) in user">{{key}}‐{{value}}</li>
<li v‐for="(item,index) in userlist" :key="item.user.uname">
<div v‐if="item.user.uname=='heima'" style="background: chartreuse"><!‐‐名称为heima的
加背景色‐‐>
{{index}}‐{{item.user.uname}}‐{{item.user.age}}
</div>
<div v‐else="">
{{index}}‐{{item.user.uname}}‐{{item.user.age}}
</div>
</li>
</ul>
</div>
</body>
<script>
new Vue({
el:'#app',
data:{
list:[1,2,3,4,4],
user:{uname:'itcast',age:10},
userlist:[
{ user:{uname:'itcast',age:10}},
{ user:{uname:'heima',age:11}}
]
}
});
</script>
</html>新しいページ03
構文V-用：（）リスト中
：配列の主キーを指定するためのキー。
添字とitems配列の削除
効果確認するためにリフレッシュを
パラメータ値は、名前付き任意に固定することができません
V-IF
2によっても表示がの残り取る
サイクルに別の組の
トラバーサルキーオブジェクトのコレクションを
場合緑の背景色の条件を満たすように
条件を満たすためにのみ表示されます
V-ELSE
