v-for 循环对象中的属性

最新推荐文章于 2024-07-23 18:27:37 发布

huxiaoxiao.

最新推荐文章于 2024-07-23 18:27:37 发布

阅读量492

点赞数

分类专栏： vue

本文链接：https://blog.csdn.net/lolhuxiaotian/article/details/121284007

版权

vue.js

vue 专栏收录该内容

65 篇文章 2 订阅

订阅专栏

<body>

    <div id="app">
        <!-- 循环对象内的值 -->
        <ul>
            <li v-for="item in per">
                {{item}}
            </li>
        </ul>
    </div>

    <script src="./js/vue.js"></script>
    <script>

        let vm =new Vue({
            el:'#app',
            data:{
                per:{
                    id:1,
                    name:'小明',
                    age:19,
                    sex:"男"
                }
            }
        })
    </script>

循环对象：

循环键值对：

<!-- 循环键和值 -->
        <ul>
                    <!-- 值    键 -->
            <li v-for="(value,key) in per">
                {{value}}---{{key}}
            </li>
        </ul>