如何映射数据：image/png;base64 in：

【问题标题】：How to map data:image/png;base64 in :如何映射数据：image/png;base64 in：
【发布时间】：2022-01-18 08:55:14
【问题描述】：

result :
{0: {name1: 'data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAfE…o7ZEAAABQlSFM6AAAwBv/Dwx2OpU7DJNTAAAAAElFTkSuQmCC'}
1: {name2: data:image/png;base64, KJGSAHGsvahvAFGD54gfCfghcg}}

我正在使用 map 使用 react 来显示 base64 图像，由于索引 0 和 1，我被困在映射图像中。

【问题讨论】：

这不是一个有效的JS数组，可能你的数据形状是这样的：{ 0: {name1:'value'}, 1: {name2: 'value'}, ... }

标签： arrays reactjs json object mapping

【解决方案1】：

你可以这样做：

const data = {
  0: {name1: 'data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAfE…o7ZEAAABQlSFM6AAAwBv/Dwx2OpU7DJNTAAAAAElFTkSuQmCC'},
  1: {name2: 'data:image/png;base64, KJGSAHGsvahvAFGD54gfCfghcg'}
}

const images = Object.keys(data).map(key => data[key][`name${Number(key)+1}`])

console.log(images);

如果你想用它来渲染 JSX 来创建一个 imgaes 数组，你可以这样做：

Object.keys(data).map(key => <img key={key} src={ data[key][`name${Number(key)+1}`] }  />)

【讨论】：