* Move getting started to Guide * Clean up summary and getting started * Shorten intro by moving stuff to individual platform docs * Make intro even shorter, summarize features * Further cleanup; move development-related docs to separate section * Make `guide` a crate. Turn code samples into examples so that we can check if they compile * Rewrite "Describing the UI": * Focus on RSX syntax (interactivity covered in later chapters); make sure samples are tested; concise language * Move some "special attribute" samples to the `examples` directory * Simplify introduction to components * Simplify introduction to component props * Document Prop features; add code samples * Simplify component children docs * Interactivity: better introduction to events * Hooks: better introduction * Remove outdated doc * Introducs use_ref * Simplify User Input chapter * Document event handler props * Meme editor example * Meme editor walkthrough * Add dark mode example * Guide for context; dark mode example * Guide: custom hooks * Guide: conditional rendering * Guide: rendering lists * Guide: rendering lists + keys * Move remaining infor from Reference to guide * Delete reference book
61 lines
1.3 KiB
Rust
61 lines
1.3 KiB
Rust
#![allow(non_snake_case)]
|
|
use dioxus::prelude::*;
|
|
|
|
fn main() {
|
|
dioxus::desktop::launch(App);
|
|
}
|
|
|
|
pub fn App(cx: Scope) -> Element {
|
|
let is_logged_in = use_state(&cx, || false);
|
|
|
|
cx.render(rsx!(LogIn {
|
|
is_logged_in: **is_logged_in,
|
|
on_log_in: |_| is_logged_in.set(true),
|
|
on_log_out: |_| is_logged_in.set(false),
|
|
}))
|
|
}
|
|
|
|
#[inline_props]
|
|
fn LogIn<'a>(
|
|
cx: Scope<'a>,
|
|
is_logged_in: bool,
|
|
on_log_in: EventHandler<'a>,
|
|
on_log_out: EventHandler<'a>,
|
|
) -> Element<'a> {
|
|
// ANCHOR: if_else
|
|
if *is_logged_in {
|
|
cx.render(rsx! {
|
|
div {
|
|
"Welcome!",
|
|
button {
|
|
onclick: move |_| on_log_out.call(()),
|
|
"Log Out",
|
|
}
|
|
}
|
|
})
|
|
} else {
|
|
cx.render(rsx! {
|
|
button {
|
|
onclick: move |_| on_log_in.call(()),
|
|
"Log In",
|
|
}
|
|
})
|
|
}
|
|
// ANCHOR_END: if_else
|
|
}
|
|
|
|
#[inline_props]
|
|
fn LogInWarning(cx: Scope, is_logged_in: bool) -> Element {
|
|
// ANCHOR: conditional_none
|
|
if *is_logged_in {
|
|
return None;
|
|
}
|
|
|
|
cx.render(rsx! {
|
|
a {
|
|
"You must be logged in to comment"
|
|
}
|
|
})
|
|
// ANCHOR_END: conditional_none
|
|
}
|