Skip to main content

The Link component

Behind the scenes, the WYSIWYG text editor uses a Link component to render links.

This component renders a normal <a> tag for external links and uses the renderLocalLink function from the configuration to render internal links, so that they leverage your React framework's router.

As we saw in RichText, for each RichText component, you may replace the Link component with any component you want, by setting the renderLink prop.

Sometimes you may want to use the <Link> component directly, for example if your block renders a link where the path or external URL must be provided from a sidebar prop.

## Properties
interface LinkProps {
href: string
target?: string
className?: string
}

Properties definition

PropertyDefinition
hrefThe URL for an external link or the local path for a local link.
targetThe target for the external link (for example "_blank").
classNameCSS class to be applied to the link tag.

It also spread {...rest} properties on the link tag

Usage example

<Link href={href}>{children}</Link>