How to display/call the icons dynamically based on the array data in react

enter image description here

How to call/display the icons based on the array data code?

data = [{
 img: '01d'
}, {
 img: '02d'
}]

data && data.map((item) => (
      <img src={`./icons/${data['img']}.svg`} />
))

What I’m trying to do here is to display the icon based on the img code dynamically.

50 thoughts on “How to display/call the icons dynamically based on the array data in react”

  1. when you looping over an array you have a single object in each loop cycle, so you can do this

    data = [{
     img: '01d'
    }, {
     img: '02d'
    }]
    
    data && data.map((item) => (
          <img src={`./icons/${item.img}.svg`} />
    ))
    
    Reply

Leave a Comment