2021-07-16 16:11:25 -04:00
|
|
|
//! Example: The basics of Dioxus
|
|
|
|
//! ----------------------------
|
|
|
|
//!
|
|
|
|
//! This small example covers some of the basics of Dioxus including
|
|
|
|
//! - Components
|
|
|
|
//! - Props
|
|
|
|
//! - Children
|
|
|
|
//! - the rsx! macro
|
|
|
|
|
2021-07-02 01:30:52 -04:00
|
|
|
use dioxus::prelude::*;
|
|
|
|
|
2021-10-16 17:37:28 -04:00
|
|
|
pub static Example: FC<()> = |(cx, props)| {
|
2021-07-02 01:30:52 -04:00
|
|
|
cx.render(rsx! {
|
|
|
|
div {
|
2021-07-16 16:11:25 -04:00
|
|
|
Greeting {
|
|
|
|
name: "Dioxus"
|
|
|
|
div { "Dioxus is a fun, fast, and portable UI framework for Rust" }
|
|
|
|
}
|
|
|
|
}
|
|
|
|
})
|
|
|
|
};
|
2021-07-02 01:30:52 -04:00
|
|
|
|
2021-07-16 16:11:25 -04:00
|
|
|
#[derive(PartialEq, Props)]
|
|
|
|
struct GreetingProps {
|
|
|
|
name: &'static str,
|
|
|
|
}
|
|
|
|
|
2021-10-16 17:37:28 -04:00
|
|
|
static Greeting: FC<GreetingProps> = |(cx, props)| {
|
2021-07-16 16:11:25 -04:00
|
|
|
cx.render(rsx! {
|
|
|
|
div {
|
2021-09-21 13:42:52 -04:00
|
|
|
h1 { "Hello, {props.name}!" }
|
2021-10-24 19:30:36 +02:00
|
|
|
p { "Welcome to the Dioxus framework" }
|
2021-07-16 16:11:25 -04:00
|
|
|
br {}
|
|
|
|
{cx.children()}
|
2021-07-02 01:30:52 -04:00
|
|
|
}
|
|
|
|
})
|
|
|
|
};
|