6、v-for遍历数组和对象

通过v-for遍历数组和对象

 <div class="app">
        <!-- 遍历数组元素以及数组下标 -->
        <ul>
            <li v-for='(item,index) in message'>{{index+1}} {{item}}</li>
        </ul>
        <!-- 遍历对象元素，对象属性以及下标 -->
        <ul>
            <!-- 对象属性 -->
            <li v-for="item in stu">{{item}}</li>
            <br>
            <!-- 对象元素，属性 -->
            <li v-for="(key,value) in stu">{{key}} {{value}}</li>
            <br>
            <!-- 对象元素，属性,下标 -->
            <li v-for="(key,value,index) in stu">{{index+1}} {{key}} {{value}}</li>
        </ul>
    </div>
    <script src='../vue.js'></script>
    <script>
        const app = new Vue({
            el: '.app',
            data: {
                message: ['18', '19', '20'],
                stu: {
                    name: 'Tom',
                    age: '18',
                    num: '1001'
                }
            }
        })
    </script>