Tengo una etiqueta de ancla. Al hacer clic en él, creo una etiqueta de anclaje y configuro el atributo href.
Algo como esto:
<a onClick={() => linkClick(url)}> Text </a> const linkClick = (url) => { const tag= document.createElement('a'); tag.rel = 'noopener noreferrer'; tag.target = _blank'; tag.href = url; tag.click(); }El problema al que me enfrento aquí es que, cuando paso el mouse sobre una etiqueta, la vista previa de la URL no está disponible (que generalmente aparece en la parte inferior izquierda) ya que el atributo href no está presente. ¿Puedes ayudarme aquí? (No quiero agregar el atributo href).
Por lo que puedo decir, tiene la URL dinámica cuando presenta el enlace. ¿Por qué no renderizar el componente completamente con React? Si va a usar React para representar su componente, le sugiero que evite cambiar el elemento DOM de esa manera después.
<a href={url} rel="noopener noreferrer" target="_blank" > Text </a>Agregue href prop a la etiqueta de anclaje y luego llame a preventDefault() en la función linkClick` así:
<a href={url} onClick={linkClick}> Text </a> const linkClick = (e) => { e.preventDefault() const tag= document.createElement('a'); tag.rel = 'noopener noreferrer'; tag.target = '_blank'; tag.href = e.target.href; tag.click(); }