条件与循环
vue中都是用v-for来进行循环的
<template>
<table border="1">
<tr>
<td v-for="item in items">{{item.name}}</td>
</tr>
</table>
</template>
<script>
export default {
data(){
return {
items:[
{name:"小明"},
{name:"小张"},
{name:"小李"},
]
}
}
}
</script>
<style>
</style>
<!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>
使用组件里的bind这个神器
<template v-for="item in myway.list">
<compa v-if="$index % 2 == 0" :data="item"></compa>
<compb v-else :data="item"></compb>
</template>
整数(Integer):任意自然数(如1,2,3,4,5)以及它们的负数或0。(整数是表示物体个数的数,0表示有0个物体)整数是人类能够掌握的最基本的数学工具。整数的全体构成整数集,整数集合是一个数环。在整数系中,自然数为0和正整数的统称,称0为零,称-1、-2、-3、?、-n、? (n为整数)为负整数。正整数、零与负整数构成整数系。 一个给定的整数n可以是负数,非负数,零(n=0)或正数。