Me gustaría establecer un enlace para mis íconos de Facebook e Instagram React . Simplemente tengo este código que es importante para esta pregunta. Para los enlaces dentro del proyecto, utilicé React Router Dom , pero nunca necesité vincular algo fuera del sitio. ¿Cómo puedo hacerlo correctamente, por favor? Intenté algo como <FacebookIcon to = "" /> y <FacebookIcon href = "" /> pero no pasó nada.
índice.js
<SocialWrapper> <FacebookIcon/> <InstagramIcon/> </SocialWrapper>estilos.js
export const SocialWrapper = styled.div` width: 100%; display: flex; gap: 10px; margin-bottom: 10px; ` export const FacebookIcon = styled(FaFacebookF)` color: ${white}; font-size: 2.3rem; &:hover{ color: ${red} } ` export const InstagramIcon = styled(FaInstagram)` color: ${white}; font-size: 2.3rem; &:hover{ color: ${red} } `Vas a querer envolver el icono con estilo en una etiqueta de anclaje con un href para tus perfiles. No podría usar React Router Link para ir a una página externa como ya ha visto y no querría simplemente lanzar un href o un evento de botón en un ícono. Algo como esto debería ser lo que buscas:
<a href="https://facebook.com/ProfileName"> <StyledIcon /> </a>Elemento de anclaje de MDN: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a
Puede simplemente poner el estilo o css esta propiedad
background-image: url()Donde pasa una cadena de un directorio de archivos o una dirección web