socialLinks: {
instagram: 'https://twitter.com/xyz',
facebook: 'https://facebook.com/xyz',
linkedin: '#',
},
how to create a loop so that result should come like this –
<div>
<a href="https://instagram.com/xyz">
<image src="instagram.png" />
</a>
<a href="https://facebook.com/xyz">
<image src="facebook.png" />
</a>
<div>
Note: If there is no link of linkedin then no link and image will come
>Solution :
You can take advantage of Object.entries:
<div>
{
Object.entries(socialLinks).filter(([k,v]) => v.startsWith("https:")).map(([k,v]) =>
<a key={v} href={v}>
<image src={`${k}.png`} />
</a>
)
}
</div>