Link
El componente Link es una representación personalizada de un enlace que utiliza Next.js Link
para manejar la navegación entre páginas. Soporta propiedades específicas para controlar el comportamiento del enlace, como el destino, la política de referenciación y la clase CSS para personalización adicional.
Ejemplo
Importación
Para importar el componente Link, se puede hacer desde fenextjs
import { Link } from "fenextjs";
Parámetros
Parámetro | Tipo | Requerido | Default | Descripcion |
---|---|---|---|---|
className | string | no | '' | Clase CSS para personalizar el estilo del enlace. |
children | ReactNode | no | '' | Contenido o texto que se muestra dentro del enlace. |
target | '_self' | '_blank' | '_parent' | '_top' | no | '_self' | Define el destino donde se abrirá el enlace. |
referrerPolicy | string | no | '' | Política de referencia que se debe usar al navegar a través del enlace. |
rel | string | no | '' | Especifica la relación entre el documento actual y el enlace. |
href | string | sí | '' | URL a la que se navega cuando se hace click en el enlace. |
Storybook
Para ver el storybook del componente lo puede hacer con este link (opens in a new tab)
Usos
- Enlace básico
<Link href="/about">About Us</Link>
- Enlace con apertura en nueva pestaña
<Link href="/contact" target="_blank">
Contact Us
</Link>