v-if
条件判断
/*如果seen为真则显示'快看我!'*/
快看我!
v-for
循环
/*遍历游戏列表,并显示游戏名称*/
{{ game.title }}
综合示例
游戏列表
最新游戏
{{game.title}} / {{game.price}}元
var myApp = new Vue({
/*绑定标签的id*/
el: '#myApp',
/*标签上绑定的数据*/
data: {
seen: false,
games: [
{title: '勇者斗恶龙', price: 400},
{title: '最终幻想', price: 580},
{title: '坦克大战', price: 99},
],
},
})
完整源码
hellovue游戏列表
最新游戏
{{game.title}} / {{game.price}}元
var myApp = new Vue({
/*绑定标签的id*/
el: '#myApp',
/*标签上绑定的数据*/
data: {
seen: true,
games: [
{title: '勇者斗恶龙', price: 400},
{title: '最终幻想', price: 580},
{title: '坦克大战', price: 99},
],
},
})
当seen改为false时则不会显示列表信息
END