socialLinks: { instagram: 'https://twitter.com/xyz', facebook: 'https://facebook.com/xyz', linkedin: '#', },
cómo crear un bucle para que el resultado sea así:
<div> <a href="https://instagram.com/xyz"> <image src="instagram.png" /> </a> <a href="https://facebook.com/xyz"> <image src="facebook.png" /> </a> <div>
Nota: si no hay un enlace de Linkedin, no aparecerá ningún enlace ni imagen.
Puede aprovechar 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>
const SocialMedia = () => { let socialLink = { instagram: 'https://twitter.com/xyz', facebook: 'https://facebook.com/xyz', twitter: 'https://twitter.com/xyz' } return ( <div> { Object.keys(socialLink).map((key, index) => { return ( <a href={socialLink[key]} key={index}> <image src={key+'.png'} /> </a> ) }) } </div> ) }