lovecoding
/
VIP23


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
							<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../vue.js"></script>
</head>
<body>
    <div id="app" >
        <!--
            for 格式 () 一个参数 省略 元素
            循环简单数组
        -->
        <ul v-for=" city in citys " >
           <li>{{city}}</li>
        </ul>

        <table cellpadding="0" cellspacing="0" border="1" >
            <tr>
                <td>序号</td>
                <td>姓名</td>
                <td>年龄</td>
            </tr>
            <!--
                格式 ( 对象 ,索引 ) in 数组
              -->
            <tr v-for="( user , index ) in users" >
                <td>{{user.id}}</td>
                <td>{{user.name}}</td>
                <td>{{user.age}}</td>
            </tr>
        </table>
    </div>
</body>
<script>
    var jsonParam = {
        el: "#app",
        data: {
            citys:["北京","南京","天津","上海","广州","深圳"],
            users:[
                {id:1,name:"阿飞",age:18},
                {id:2,name:"小红",age:19},
                {id:3,name:"小黑",age:20},
                {id:4,name:"小灰",age:22},
                {id:5,name:"小黄",age:24}
            ]
        }
    }
    var vue = new Vue(jsonParam);
</script>
</html>