---
title: Link
description: Handles any kind of link.
---

---

<Info>
This component is part of the `jaspr_router` package. Make sure to add this to your dependencies
before using the component.
</Info>

The `Link` component is a drop-in replacement for the `<a>` tag.

When available, it uses client-side navigation (no page reload on click) and falls back to the default
server-side navigation.

```dart
yield Link(
  to: '/about',
  child: Text('About'),
);
```

renders to

```html
<a href="/about">About</a>
```

## Client-Side Navigation

When using client-side routing, the `Link` component will override the default behavior of the `<a>`
tag and use the [`Router`s](/components/router) `push()` or `replace()` method to navigate to the target route when clicked.

## Parameters

- `to`: The url to navigate to.
- `replace`: Whether to replace the route instead of pushing. *Only affects client-side routing.*
- `extra`: The extra data to attach to the new route. *Only affects client-side routing.*
- `preload`: Whether to preload the target route when the link is hovered. *Only affects client-side routing when using lazy routes.*
- `target`: The `target` attribute value applied to the anchor element.
- `referrer`: The `referrerpolicy` attribute value applied to the anchor element.
- `classes`, `styles`, `attributes`: Other standard properties applied to the anchor element.
- `child` and `children`: Components to render inside the anchor element.
