vue中v-for 循環(huán)對象中的屬性
更新時間：2021年11月22日 09:30:11 作者：huxiaoxiao
這篇文章主要介紹了 vue中v-for 循環(huán)對象中的屬性，文章圍繞v-for 循環(huán)對象的相關(guān)資料展開詳細內(nèi)容,需要的朋友可以參考一下，希望對大家有所幫助
1、循環(huán)對象內(nèi)的值
<body>
<div id="app">
<!-- 循環(huán)對象內(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)對像
3、循環(huán)鍵和值
<!-- 循環(huán)鍵和值 -->
<ul>
<!-- 值 鍵 -->
<li v-for="(value,key) in per">
{{value}}---{{key}}
</li>
</ul>
到此這篇關(guān)于 vue中v-for 循環(huán)對象中的屬性的文章就介紹到這了,更多相關(guān) v-for 循環(huán)對象中的屬性內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
這篇文章主要介紹了Vue如何實現(xiàn)多頁面配置以及打包方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-10-10
這篇文章通過實例代碼給大家介紹了vue-父子組件傳值和ref獲取dom和組件的方法，非常不錯，具有一定的參考借鑒價值,需要的朋友可以參考下2019-11-11
vue3 setup中defineEmits與defineProps的使用案例詳解
在父組件中定義String、Number、Boolean、Array、Object、Date、Function、Symbol這些類型的數(shù)據(jù),使用defineEmits會返回一個方法,使用一個變量emits(變量名隨意)去接收,本文給大家介紹vue3 setup中defineEmits與defineProps的使用案例,感興趣的朋友一起看看吧2023-10-10
這篇文章主要介紹了Vue Autocomplete 自動完成功能,結(jié)合簡單示例形式分析了Vue使用el-autocomplete組件實現(xiàn)自動完成功能相關(guān)操作技巧,需要的朋友可以參考下2019-05-05
這篇文章主要介紹了vue中的keep-alive的相關(guān)資料，幫助大家更好的理解和使用vue框架，感興趣的朋友可以了解下2021-01-01
這篇文章主要介紹了淺談vue父子組件怎么傳值,小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-07-07
本篇文章主要介紹了vue-loader教程介紹，vue-loader就是告訴webpack如何將vue格式的文件轉(zhuǎn)換成js。有興趣的可以了解一下2017-06-06
vue.js-div滾動條隱藏但有滾動效果的實現(xiàn)方法
下面小編就為大家分享一篇vue.js-div滾動條隱藏但有滾動效果的實現(xiàn)方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-03-03
Vue實現(xiàn)未登錄跳轉(zhuǎn)到登錄頁的示例代碼
本文主要介紹了Vue實現(xiàn)未登錄跳轉(zhuǎn)到登錄頁的示例代碼，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2022-08-08
這篇文章主要為大家詳細介紹了vue+Element-ui實現(xiàn)分頁效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-11-11