VUE3（五）列表渲染

遍历对象

    <template id="my-app">
        <h2>个人信息</h2>
        <ul>
            <!-- 遍历对象 -->
            <!-- 拿到的应该是键值对，只写一个拿到的是value -->
            <!-- <li v-for="value in info">{{value}}</li> -->
            <li v-for="(value, key, index) in info">{{index+1}}-{{key}}-{{value}}</li>
        </ul>
    </template>
    <script src="../js/vue.js"></script>
    <script>
        const app={
            template:"#my-app",
            data(){
                return{
                    info: {
                        name: "sk",
                        age: 18,
                        height: 1.88
                    }
                }
            }
        };
        Vue.createApp(app).mount("#app");
    </script>

第一个参数是value，第二个参数是key，第三个参数是下标。