use rscx::{component, html, props, MapFragmentExt};
#[tokio::main]
async fn main() -> Result<(), Box> {
let app = app().await;
println!("{}", app);
Ok(())
}
// simple function returning a String
// it will call the Items() function
async fn app() -> String {
let s = "ul { color: red; }";
html! {
// call a component with no props
// call a component with props and children
}
}
#[props]
/// mark a struct with #[props] to use it as props in a component.
/// #[builder] can customize single props, marking them as option or setting a default value.
struct SectionProps {
#[builder(setter(into), default = "Default Title".to_string())]
title: String,
#[builder(default)]
children: String,
}
#[component]
/// mark functions with #[component] to use them as components inside html! macro
fn Section(props: SectionProps) -> String {
html! {
{ props.title }
{ props.children }
}
}
#[component]
async fn Items() -> String {
let data = load_data_async().await;
html! {
{
data
.into_iter()
.map_fragment(|item| html! { - { item }
})
}
}
}
/// async functions can be easily used in the body of a component, as every component is an async
/// function
async fn load_data_async() -> Vec {
vec!["a".to_string(), "b".to_string(), "c".to_string()]
}