vue遍历new Map()对象数据

最新推荐文章于 2025-03-07 16:05:28 发布

努力努力再努力zh

最新推荐文章于 2025-03-07 16:05:28 发布

阅读量3.8k

点赞数 1

分类专栏： vue js

本文链接：https://blog.youkuaiyun.com/qq_15769147/article/details/117361491

版权

vue 同时被 2 个专栏收录

24 篇文章

订阅专栏

8 篇文章

订阅专栏

这个博客展示了如何在Vue应用中使用`<liv-for>`和`<pv-for>`指令遍历Map对象，并分别显示键值对。内容涉及到在mounted钩子函数中初始化Map对象，然后在模板中通过循环展示每个键对应的值，包括name和age属性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

data () {
  return {
    map: new Map()
  }
},
mounted () {
  this.map.set('a', [{ name: 'a', age: 18 }]);
  this.map.set('b', [{ name: 'b', age: 20 }]);
}

<li v-for="[key, value] of map" :key="key">
  <span>key: {{ key }}</span>
  <p v-for="(data, index) in value" :key="index">
    <span>name: {{ data.name }}</span>
    <span>age: {{ data.age }}</span>
  </p>
</li>