79 lines
2.3 KiB
Rust
79 lines
2.3 KiB
Rust
|
use crate::error_template::{AppError, ErrorTemplate};
|
||
|
use leptos::*;
|
||
|
use leptos_meta::*;
|
||
|
use leptos_router::*;
|
||
|
|
||
|
#[component]
|
||
|
pub fn App() -> impl IntoView {
|
||
|
// Provides context that manages stylesheets, titles, meta tags, etc.
|
||
|
provide_meta_context();
|
||
|
|
||
|
view! {
|
||
|
|
||
|
|
||
|
// injects a stylesheet into the document <head>
|
||
|
// id=leptos means cargo-leptos will hot-reload this stylesheet
|
||
|
<Stylesheet id="leptos" href="/pkg/watch.css"/>
|
||
|
<Link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css"
|
||
|
rel="stylesheet"
|
||
|
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
|
||
|
crossorigin="anonymous"
|
||
|
/>
|
||
|
|
||
|
// sets the document title
|
||
|
<Title text="Welcome to Leptos"/>
|
||
|
|
||
|
// content for this welcome page
|
||
|
<Router fallback=|| {
|
||
|
let mut outside_errors = Errors::default();
|
||
|
outside_errors.insert_with_default_key(AppError::NotFound);
|
||
|
view! {
|
||
|
<ErrorTemplate outside_errors/>
|
||
|
}
|
||
|
.into_view()
|
||
|
}>
|
||
|
<main class="container">
|
||
|
<Routes>
|
||
|
<Route path="" view=HomePage/>
|
||
|
</Routes>
|
||
|
</main>
|
||
|
</Router>
|
||
|
}
|
||
|
}
|
||
|
|
||
|
#[server]
|
||
|
pub async fn get_all() -> Result<Vec<String>, ServerFnError> {
|
||
|
use std::time::Duration;
|
||
|
|
||
|
std::thread::sleep(Duration::from_millis(250));
|
||
|
println!("Loading");
|
||
|
Ok(vec!["data1".to_string(), "data2".to_string()])
|
||
|
}
|
||
|
|
||
|
/// Renders the home page of your application.
|
||
|
#[component]
|
||
|
fn HomePage() -> impl IntoView {
|
||
|
// Creates a reactive value to update the button
|
||
|
let load = create_local_resource(|| (), |_| async move { get_all().await });
|
||
|
|
||
|
view! {
|
||
|
<h1>"Welcome to Leptos!"</h1>
|
||
|
{
|
||
|
move || match load() {
|
||
|
None => view!{ <div>"Loading..."</div> },
|
||
|
Some(data) => {
|
||
|
view! {
|
||
|
<div><ul>
|
||
|
{
|
||
|
data.unwrap_or_default().into_iter().map(|d| view!{
|
||
|
<li>{d}</li>
|
||
|
}).collect::<Vec<_>>()
|
||
|
}
|
||
|
</ul></div>
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
}
|