82 releases
0.7.0 | Nov 30, 2024 |
---|---|
0.7.0-rc0 | Oct 22, 2024 |
0.7.0-preview2 |
|
0.6.9 | Mar 4, 2024 |
0.0.3 | Nov 27, 2022 |
#1853 in Web programming
33,537 downloads per month
Used in 35 crates
(31 directly)
210KB
4K
SLoC
Leptos Meta
Leptos Meta allows you to modify content in a document’s <head>
from within components
using the Leptos
web framework.
Document metadata is updated automatically when running in the browser. For server-side
rendering, after the component tree is rendered to HTML, ServerMetaContextOutput::inject_meta_context
will inject meta tags into a stream of HTML inside the <head>
.
use leptos::prelude::*;
use leptos_meta::*;
#[component]
fn MyApp() -> impl IntoView {
// Provides a [`MetaContext`], if there is not already one provided.
provide_meta_context();
let (name, set_name) = create_signal("Alice".to_string());
view! {
<Title
// reactively sets document.title when `name` changes
text=move || name.get()
// applies the `formatter` function to the `text` value
formatter=|text| format!("“{text}” is your name")
/>
<main>
<input
prop:value=move || name.get()
on:input=move |ev| set_name.set(event_target_value(&ev))
/>
</main>
}
}
Feature Flags
csr
Client-side rendering: Generate DOM nodes in the browserssr
Server-side rendering: Generate an HTML string (typically on the server)hydrate
Hydration: use this to add interactivity to an SSRed Leptos appstable
By default, Leptos requiresnightly
Rust, which is what allows the ergonomics of calling signals as functions. Enable this feature to supportstable
Rust.
Important Note: You must enable one of csr
, hydrate
, or ssr
to tell Leptos
which mode your app is operating in.
Dependencies
~21–34MB
~521K SLoC