Function Link

pub fn Link(props: LinkProps) -> Element

A link to navigate to another route.

Only works as descendant of a [Router] component, otherwise it will be inactive.

Unlike a regular HTML anchor, a Link allows the router to handle the navigation and doesn’t cause the browser to load a new page.

However, in the background a Link still generates an anchor, which you can use for styling as normal.

External targets

When the Links target is an NavigationTarget::External target, that is used as the href directly. This means that a Link can always navigate to an NavigationTarget::External target, even if the [HistoryProvider] does not support it.

Panic

• When the Link is not nested within a [Router], but only in debug builds.

Example

#[derive(Clone, Routable)]
enum Route {
    #[route("/")]
    Index {},
}

#[component]
fn App() -> Element {
    rsx! {
        Router::<Route> {}
    }
}

#[component]
fn Index() -> Element {
    rsx! {
        Link {
            active_class: "active",
            class: "link_class",
            id: "link_id",
            new_tab: true,
            rel: "link_rel",
            to: Route::Index {},

            "A fully configured link"
        }
    }
}