<body>



    <div id="app">

        <!-- 循環(huán)對(duì)象內(nèi)的值 -->

        <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>

2、循環(huán)對(duì)像

3、循環(huán)鍵和值

<!-- 循環(huán)鍵和值 -->

        <ul>

                    <!-- 值    鍵 -->

            <li v-for="(value,key) in per">

                {{value}}---{{key}}

            </li>

        </ul>

到此這篇關(guān)于 vue中v-for 循環(huán)對(duì)象中的屬性的文章就介紹到這了,更多相關(guān) v-for 循環(huán)對(duì)象中的屬性內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章:

相關(guān)文章

Vue如何實(shí)現(xiàn)多頁面配置以及打包方式
這篇文章主要介紹了Vue如何實(shí)現(xiàn)多頁面配置以及打包方式，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2022-10-10
vue-父子組件和ref實(shí)例詳解
這篇文章通過實(shí)例代碼給大家介紹了vue-父子組件傳值和ref獲取dom和組件的方法，非常不錯(cuò)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下
2019-11-11
vue3 setup中defineEmits與defineProps的使用案例詳解
在父組件中定義String、Number、Boolean、Array、Object、Date、Function、Symbol這些類型的數(shù)據(jù),使用defineEmits會(huì)返回一個(gè)方法,使用一個(gè)變量emits(變量名隨意)去接收,本文給大家介紹vue3 setup中defineEmits與defineProps的使用案例,感興趣的朋友一起看看吧
2023-10-10
Vue Autocomplete 自動(dòng)完成功能簡單示例
這篇文章主要介紹了Vue Autocomplete 自動(dòng)完成功能,結(jié)合簡單示例形式分析了Vue使用el-autocomplete組件實(shí)現(xiàn)自動(dòng)完成功能相關(guān)操作技巧,需要的朋友可以參考下
2019-05-05
vue keep-alive的簡單總結(jié)
這篇文章主要介紹了vue中的keep-alive的相關(guān)資料，幫助大家更好的理解和使用vue框架，感興趣的朋友可以了解下
2021-01-01
淺談vue父子組件怎么傳值
這篇文章主要介紹了淺談vue父子組件怎么傳值,小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2018-07-07
vue-loader教程介紹
本篇文章主要介紹了vue-loader教程介紹，vue-loader就是告訴webpack如何將vue格式的文件轉(zhuǎn)換成js。有興趣的可以了解一下
2017-06-06
vue.js-div滾動(dòng)條隱藏但有滾動(dòng)效果的實(shí)現(xiàn)方法
下面小編就為大家分享一篇vue.js-div滾動(dòng)條隱藏但有滾動(dòng)效果的實(shí)現(xiàn)方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
2018-03-03
Vue實(shí)現(xiàn)未登錄跳轉(zhuǎn)到登錄頁的示例代碼
本文主要介紹了Vue實(shí)現(xiàn)未登錄跳轉(zhuǎn)到登錄頁的示例代碼，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2022-08-08
vue+Element-ui實(shí)現(xiàn)分頁效果
這篇文章主要為大家詳細(xì)介紹了vue+Element-ui實(shí)現(xiàn)分頁效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-11-11