怎么用vue.js循环一个list
1个回答
展开全部
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>list</title>
</head>
<body>
<ul id="list">
<li v-for="item in items">
{{ item.message }}
</li>
<br>
<li v-for="(item,index) in items">
{{index}}:{{ item.message }}
</li>
<br>
<template v-for="item in items">
<li>{{ item.message }}</li>
<li>--------------</li>
</template>
<br>
<li v-for="value in object">
{{ value }}
</li>
<br>
<li v-for="(value,key) in object">
{{key}}:{{ value }}
</li>
<br>
<li v-for="n in 10">{{ n }}</li>
<br>
<li v-for="n in numbers">{{ n }}</li>
</ul>
<!--of 替代 in-->
<script src="js/vue.js"></script>
<script>
var vm = new Vue({
el:"#list",
data: {
items: [
{message: 'Foo' },
{message: 'Bar' }
],
object: {
FirstName: 'John',
LastName: 'Doe',
Age: 30
},
numbers: [ 1, 2, 3, 4, 5 ]
},
computed:{
list:function(){
this.items.push({ message: 'Baz' })
},
evenNumbers: function () {
return this.numbers.filter(function (number) {
return number % 2 === 0
})
}
}
})
</script>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
