vueJS-V-for指令学习
首先我们在data中定义一个数组，为items，然后在body中，添加一个ul，li来进行循环数组，其中v-for指令里面的语法是， v-for=”item in items”是将items数组中的元素读取到item中，然后进行循环、
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
<body>
<h1>v-for实例</h1>
<div id="app">
<ul>
<li v-for="item in sertitems">
{{item}}
</li>
</ul>
<hr>
<ul>
<li v-for="(student,index)in sortStudents">
{{index+1}}:{{student.name}}-{{student.age}}
</li>
</ul>
</div>
<script src="js/vue.js"></script>
<script>
new Vue({
el:'#app',
data:{
items:[53,25,88,88,55,89,45,80],
students:[
{name:'Cat',age:11},
{name:'Gog',age:14},
{name:'People',age:111},
{name:'You',age:18},
]
},
computed:{
sertitems:function(){
return this.items.sort(sortNumber);
},
sortStudents:function(){
return sortByKey(this.students,'age');
}
}
});
function sortNumber(a,b){
return a-b;
}
//数组对象方法排序:
function sortByKey(array,key){
return array.sort(function(a,b){
var x=a[key];
var y=b[key];
return ((x<y)?-1:((x>y)?1:0));
});
}
</script>
</body>
2. 对循环中的值进行排序。使用computd，在items输出时，对数组进行排序。使用sort方法进行排序。
3. 进行循环对象。
首先定义一个数组：
然后使用v-for进行循环读取数据，使用（student，index）可以输出数组的序号，这里的index，可以随便取名，但是在通常编程中，我们还是使用index，表示索引值，
对对象数组进行排序，
