Function leptos_meta::Title

source ·
pub fn Title(cx: Scope, props: TitleProps) -> impl IntoView
Expand description

A component to set the document’s title by creating an HTMLTitleElement.

The title and formatter can be set independently of one another. For example, you can create a root-level <Title formatter=.../> that will wrap each of the text values of <Title/> components created lower in the tree.

use leptos::*;
use leptos_meta::*;

#[component]
fn MyApp(cx: Scope) -> impl IntoView {
    provide_meta_context(cx);
    let formatter = |text| format!("{text} — Leptos Online");

    view! { cx,
      <main>
        <Title formatter/>
        // ... routing logic here
      </main>
    }
}

#[component]
fn PageA(cx: Scope) -> impl IntoView {
    view! { cx,
      <main>
        <Title text="Page A"/> // sets title to "Page A — Leptos Online"
      </main>
    }
}

#[component]
fn PageB(cx: Scope) -> impl IntoView {
    view! { cx,
      <main>
        <Title text="Page B"/> // sets title to "Page B — Leptos Online"
      </main>
    }
}

Required Props

  • cx: [Scope]

Optional Props

  • formatter: implInto<Formatter>
    • A function that will be applied to any text value before it’s set as the title.
  • text: implInto<TextProp>
    • Sets the the current document.title.