时间戳

首页 > 解决方案 > 在反应中渲染哈希图数据

javascript - 在反应中渲染哈希图数据

问题描述

我正在将 api 中的 hashmap 数据检索到我的反应应用程序中。数据看起来像这样..

[
    [
        "d243dc7-6fe8-151b-4ca8-1be528f2b36",
        "[\"Jonny\",70]"
    ],
    [
        "8affa17-76d1-13e-6380-7cd2a3e3647",
        "[\"Lucy\",106,"pic3.jpg"]"
    ],
    [
        "841cb28-24c7-872-3c66-63253800c8d",
        "[\"Mike\",0]"
    ],
    [
        "6128e-182-cfb4-708b-c40a3ba2e6e",
        "[\"Elodie\",23,"me.jpg"]"
    ],
    [
        "e55ef4c-8d41-3be4-27d-aae53330584",
        "[\"Jacob\",9,"img-004.jpeg"]"
    ]
]

我需要将这些数据呈现到表格中。

使用 map 和 with data.slice(0, 1) 我已经成功地提取了密钥（长字符串），但我需要帮助分离名称、数字和可选图像。我尝试使用各种运算符进行试验。我以为这行得通

{data.slice(1, 2).toString().substring(2,data.slice(1, 2).length-2)}

但它只是返回 ["

我希望有一个更简单的方法来做到这一点！

标签： javascriptreactjshashmap

解决方案

您以一种奇怪的格式显示数据，但这有效：

const data = [
    [
        "d243dc7-6fe8-151b-4ca8-1be528f2b36",
        "[\"Jonny\",70]"
    ],
    [
        "8affa17-76d1-13e-6380-7cd2a3e3647",
        "[\"Lucy\",106,\"pic3.jpg\"]"
    ],
    [
        "841cb28-24c7-872-3c66-63253800c8d",
        "[\"Mike\",0]"
    ],
    [
        "6128e-182-cfb4-708b-c40a3ba2e6e",
        "[\"Elodie\",23,\"me.jpg\"]"
    ],
    [
        "e55ef4c-8d41-3be4-27d-aae53330584",
        "[\"Jacob\",9,\"img-004.jpeg\"]"
    ]
];

const data1 = JSON.parse(data.slice(1, 2)[0][1]);

console.log('name', data1[0]);
console.log('numb', data1[1]);
console.log('file', data1[2]);

推荐阅读