vue.js遍历map的方法:vue使用【v-for】遍历map,代码为【0b7d04cdb74b66e05b2447123ab970c6】。
本教程操作环境:windows10系统、vue2.9,本文适用于所有品牌的电脑。
【相关文章推荐:vue.js】
vue.js遍历map的方法:
对象数据如下:
"cities": {"a": [{"id": 56,"spell": "aba","name": "阿坝"}, {"id": 57,"spell": "akesu","name": "阿克苏"}],"b": [{"id": 58,"spell": "baiyin","name": "白银"}, {"id": 59,"spell": "bangbu","name": "蚌埠"}],"c": [{"id": 60,"spell": "chengdu","name": "成都"}, {"id": 61,"spell": "cangzhou","name": "沧州"}]
遍历方法如下:
<div class="area" v-for="(item, key) of cities" :key="key"> <div class="title border-topbottom">{{key}}</div> <div class="item-list"> <div class="item border-bottom" v-for="inneritem of item" :key="inneritem.id">{{inneritem.name}}</div> </div> </div>
关键就是 v-for=(item, key) of cities,相当于map结构的 (key, value)
相关免费学习推荐:javascript(视频)
以上就是vue.js如何遍历map的详细内容。