vue接收后端返回的map

如果后端返回的是一个 Map 类型的数据，那么前端可以使用 Vue.js 提供的 v-for 指令来遍历该 Map 对象，并渲染到页面上。

首先需要将 Map 对象转换成数组形式，可以使用 Object.entries() 方法将 Map 对象转换成一个由键值对组成的二维数组，然后在前端通过 v-for 指令遍历该数组，如下所示：

<template>
  <div>
    <ul>
      <li v-for="item in items" :key="item[0]">
        {{ item[0] }}: {{ item[1] }}
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      mapData: new Map([
        ['key1', 'value1'],
        ['key2', 'value2'],
        ['key3', 'value3'],
      ]),
    };
  },
  computed: {
    items() {
      // 将 Map 对象转换成数组形式
      return Array.from(this.mapData);
    },
  },
};
</script>

在上述代码中，通过 computed 计算属性将 Map 对象转换成数组形式，并传递给 v-for 指令进行遍历渲染。需要注意的是，在 v-for 中需要为每个遍历项设置一个唯一的 key 值，这里使用了 Map 对象中的键作为 key 值。