Quiero usar un <Link /> sin contenido dentro de mi aplicación, pero por alguna razón, si no le paso ningún contenido, aparece el error "múltiples niños", cuando en realidad es todo lo contrario ocurriendo [ Ver el error aquí ]
Entonces, ¿cómo haría que el siguiente código funcionara sin hacer ninguna solución alternativa? La documentación no parece mencionar nada al respecto.
<Link href="/example"></Link> En caso de que se pregunte por qué estoy haciendo esto, cuando estoy procesando background-image que se puede hacer clic, en lugar de colocar el enlace en el exterior del elemento con esa propiedad, lo coloco en el interior y hago que ocupe el elemento principal completo, en lugar de romper la estructura de la página con un elemento en línea (y HTML y CSS adicionales potencialmente innecesarios).
Gracias.
React Fragments puede resolver el problema; no agregan elementos HTML adicionales. Podrías hacer algo como esto (asegúrate de importar React):
<Link href="/example"> <React.Fragment></React.Fragment> </Link>O simplemente:
<Link href="/example"><></></Link> De esta manera, está pasando exactamente "un niño" a <Link> que no devuelve nada.
Tienes que pasar un elemento ancla como elemento secundario y passHref como accesorio del elemento Link .
<Link href="/example" passHref> <a /> </Link>