<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div id="app"> <ul> <li v-for="food in foodList"> {{food.name}}:¥{{food.discount ? food.price*food.discount : food.price }} </li> </ul> </div> <script src="../lib/vue.js"></script> <script src="js/main.js"></script> </body> </html>
var app = new Vue({
el:"#app",
data:{
// foodList:["葱","姜","蒜"],
foodList:[
{
name:"葱",
price:10,
discount:.8
},
{
name:"姜",
price:8,
discount:.6
},
{
name:"蒜",
price:6,
}
]
}
})