vue怎么循环map
时间: 2023-06-22 15:25:28 浏览: 149
vue的for循环使用方法
5星 · 资源好评率100%
在 Vue 中,可以使用 `v-for` 指令来循环遍历数组、对象或者 Map。对于 Map,需要使用 `v-for` 的特殊语法,如下所示:
```html
<template>
<ul>
<li v-for="(value, key) in myMap" :key="key">
{{ key }}: {{ value }}
</li>
</ul>
</template>
<script>
export default {
data() {
return {
myMap: new Map([
['a', 1],
['b', 2],
['c', 3]
])
}
}
}
</script>
```
在上面的代码中,我们使用 `v-for` 指令遍历 `myMap`,并且使用 `(value, key)` 的语法来分别获取 Map 中的值和键。在模板中,我们可以直接使用 `key` 和 `value` 来访问 Map 中的键值对。同时,我们也需要使用 `:key` 属性来为每个循环项指定一个唯一的键。
阅读全文