reactjs React JS如何将数组复制到对象/字典数组

mkh04yzy 于 2022-11-29 发布在 React

关注(0)|答案(4)|浏览(176)

我有下面的列表代表来自Flask后端的图像源，

[
   "www.example.com","www.example2.com","www.example3.com"...
]

现在我尝试使用react react图像库来显示所有这些图像。从教程中我看到我需要如下所示：

const images = [
  {
    original: "www.example.com",
    thumbnail: "www.example.com/thumbnail",
  }
]

我对如何将图像URL的数组列表Map到这个对象/字典数组感到困惑？理想情况下，我需要将其设置为：

const images = [
  {
    original: "www.example.com",
    thumbnail: "www.example.com/thumbnail",
  },
  {
    original: "www.example2.com",
    thumbnail: "www.example2.com/thumbnail",
  },
  {
    original: "www.example3.com",
    thumbnail: "www.example3.com/thumbnail",
  }......
]

有没有人能告诉我？任何帮助都将不胜感激！

reactjs

来源：https://stackoverflow.com/questions/74591093/react-js-how-to-copy-array-into-object-dictionary-array

4条答案

按热度按时间

wljmcqd81#

您可以对源数组执行map，如下所示：

const srcArr = ["www.example.com", "www.example2.com", "www.example3.com"]

const result = srcArr.map(original => ({ original, thumbnail: `${original}/thumbnail`}));
console.log(result)

赞(0）回复(0）举报 2022-11-29

rkue9o1l2#

只需使用map

const list = [
   "www.example.com","www.example2.com","www.example3.com",
  
]

const result = list.map(item => {
  return {
     original: item,
     thumbnail: `${item}/thumbnail`,
  }
})

console.log(result)

赞(0）回复(0）举报 2022-11-29

ercv8c1e3#

Array.prototype.map()是一个不错的选择。
也许你应该学习一些数组here的原型方法。

赞(0）回复(0）举报 2022-11-29

3ks5zfa04#

只需使用Map：

const list = [
   "www.example.com","www.example2.com","www.example3.com",
  
]

const result = list.map(item => {
  return {
     original: item,
     thumbnail: `${item}/thumbnail`,
  }
})

console.log(result)

赞(0）回复(0）举报 2022-11-29

我来回答

reactjs React JS如何将数组复制到对象/字典数组

4条答案

相关问题

热门标签

最新问答