MVVM框架第二小章节

1.Vue写多项数据

例子：

　v-for循环

<div id="mydiv">
　　　　<ol>
　　　　　　<!-- 把li配置为一个循环项 ；

　　　　　　　　v-for:多条子类
　　　　　　　　student:本身有3个值,也就是name所对应的值
　　　　　　-->
　　　　　　<li v-for="student in studentList">{{student.name}}    </li>
　　　　</ol>
　　</div>

c:forEach循环

<c:forEach var="studnet"    items="studnetList" >

　　<li>${student.name}</li>

</c:forEach>

　for循环

for(Student   student  :  studentList){

　　System.out.println(studnet.getName());

}

注意：这三个循环的作用是一样的

<script src="${pageContext.request.contextPath}/js/vue.js"></script>
　　<script>
　　　　/*name也就相等于实体类 */
　　　　var myModel = {studentList:[{name:'小米'},{name:'小黑'},{name:'小卡'}]};//数组
　　　　var myViewModel = new Vue({
　　　　　　el:'#mydiv',　　
　　　　　　data:myModel　　
　　　　});
　　</script>

 

 运行后，在控制台还可以往里面添加数据,然后View层的数据也会随着在控制台的增加而增加。