Skip to main content

TextLink

import { TextLink } from 'solito/link'

A drop-in replacement for Next.js' <Link /> component. It follows the exact same API.

The difference from Solito's <Link /> component is that this component accepts Text nodes as children.

<TextLink href="/">Home</Link>

You can also put nested Text components inside:

<TextLink href="/">
  <Text>Home</Text>
</Link>

Props​

textProps​

Props used by the underlying Text component.

<TextLink textProps={{ style: { color: 'blue' } }} href="/">
  Link to <Text style={{ fontWeight: 'bold' }}>Home</Text>
</Link>

Next.js props​

It also supports the props from Next.js' <Link /> component, besides passHref.

Configuration​

Before a Link can work on iOS and Android, you'll need to properly configure your linking config with React Navigation.

See their docs: