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ámetroTipoRequeridoDefaultDescripcion
classNamestringno''Clase CSS para personalizar el estilo del enlace.
childrenReactNodeno''Contenido o texto que se muestra dentro del enlace.
target'_self' | '_blank' | '_parent' | '_top'no'_self'Define el destino donde se abrirá el enlace.
referrerPolicystringno''Política de referencia que se debe usar al navegar a través del enlace.
relstringno''Especifica la relación entre el documento actual y el enlace.
hrefstring''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>