如何将图像存储在对象中？答案

【问题标题】：How to store images in Objects?如何将图像存储在对象中？
【发布时间】：2020-07-08 23:44:29
【问题描述】：

在此数组中存储 url 图像的正确方法是什么？如果我调用 this.props.cover，我希望它显示链接的图像。解决这个问题的正确方法是什么？

const ALBUMS = [
  {  id: 1, 
    title: "Lemonade", 
    artist: "Beyoncé", 
    year: 2016 
 cover: img src= "https://upload.wikimedia.org/wikipedia/en/e/e9/Massive_Attack_-_Mezzanine.png"
  }

【问题讨论】：

你是如何渲染这个数组的？
codepen.io/ganiya/pen/NWxMgbK?editors=0010 使用了亚历克斯的建议并且有效

标签： reactjs object react-props

【解决方案1】：

您应该存储一个如下所示的 URL 并将数组作为道具传递。

const albume = [
  {  id: 1, 
    title: "Lemonade", 
    artist: "Beyoncé", 
    year: 2016 ,
 cover: "https://upload.wikimedia.org/wikipedia/en/e/e9/Massive_Attack_-_Mezzanine.png"
  }]


const showImgs=(props)=>(props.map((x,key)=>
   <img key={key} alt='' src={x.cover} />
  ))

Look at this sample

【讨论】：

谢谢！我对所有道具都使用了过滤器，所以我做了
{album.title} - {album.artist} - {album.year}

【解决方案2】：

正常存储网址

const ALBUMS = [
      {
        id: 1,
        title: "Lemonade",
        artist: "Beyoncé",
        year: 2016,
        cover: "https://upload.wikimedia.org/wikipedia/en/e/e9/Massive_Attack_-_Mezzanine.png"
      }
    ]

如果你想使用它，你可以通过调用对象来使用它。

ALBUMS[0].cover

【讨论】：

{album.title} - {album.artist} - {album.year}