Vue:Can'；t使用v-for:key显示带有键和值的Javascript映射

我有这样一个Json：

{
   "data":{
      "1":{
         "color":"red",
         "size":"big"
      },
      "2":{
         "color":"red",
         "size":"big"
      },
      "3":{
         "color":"red",
         "size":"big"
      },
      "4":{
         "color":"red",
         "size":"big"
      },
      "5":{
         "color":"red",
         "size":"big"
      }
   }
}

我尝试使用以下方法仅显示数字

1,2,3,5

：

<div v-for = "pos in this.breakdown" :key = "pos">
            <p>{{pos}}</p>
</div>

在将其转换为Javascript的地图后，我尝试显示它：

function jsonToMap(jsonString)  {
    var jsonObject = JSON.parse(jsonString);
    var dataObject = jsonObject.data;
    var dataMap = new Map(Object.entries(dataObject));
    var resultMap = new Map();
    for (const pos of dataMap.keys())  {
        console.log(pos);
        var posMap = new Map(Object.entries(dataMap.get(pos)));
        resultMap.set(pos, posMap);
    }

    console.log("done!");
    return resultMap;
}

---

在

v-for

循环中，您可以提供第二个可选参数来获取迭代项的索引：

“数据”：{
“项目”：[
“项目1”，
“项目2”，
“项目3”
]
}

{{index}}:{{item}

将输出：

0 : item 1 
1 : item 2 
2 : item 3

现在根据您的示例进行调整：

具有未知的对象索引

{{pos}}：

{{obj2}}={{pos2}

---

请参阅官方文档中的更多

v-for

可能性：

在

v-for

循环中，您可以提供第二个可选参数来获取您正在迭代的项目的索引：

“数据”：{
“项目”：[
“项目1”，
“项目2”，
“项目3”
]
}

{{index}}:{{item}

将输出：

0 : item 1 
1 : item 2 
2 : item 3

现在根据您的示例进行调整：

具有未知的对象索引

{{pos}}：

{{obj2}}={{pos2}

---

请参阅官方文档中的更多

v-for

可能性：

您可以在

v-for

中插入

index

，如

v-for=“（pos，index）”在此.breakdown中插入
index
，如
v-for=“（pos，index）”在此.breakdown中插入
index
我用我的最终答案编辑了我的问题，如果你把它包括在你的答案中，它可能会帮助未来的读者。我用我的最终答案编辑了我的问题，如果你把它包括在你的答案中，它可能会帮助未来的读者

        <div v-for="(obj, pos) in this.breakdown" :key="pos">
            <p>{{ pos }}: </p>

            <div v-for = "(obj2, pos2) in obj" :key="pos2">
                <p>{{obj2}} = {{pos2}}</p>
            </div>
        </div>

1:

red = color

big = size

2:

red = color

big = size

3:

red = color

big = size

4:

red = color

big = size

5:

red = color

big = size


0 : item 1 
1 : item 2 
2 : item 3