dioxus-html-macro

Crates.iodioxus-html-macro
lib.rsdioxus-html-macro
version0.3.0
sourcesrc
created_at2021-01-19 14:12:45.482738
updated_at2023-05-11 14:19:24.014234
descriptionAn html macro for dioxus applications.
homepage
repositoryhttps://github.com/DioxusLabs/dioxus-html-macro
max_upload_size
id343965
size116,731
(tvallotton)

documentation

README

dioxus html macro

This crate offers an html! like macro for dioxus applications. It expands to the equivalent rsx! macro call you would have made otherwise, so it does not rely on any dioxus' internals.

use dioxus::prelude::*; 
use dioxus_html_macro::html; 

fn app(cx: Scope) -> Element {
    let mut count = use_state(&cx, || 0);
    cx.render(html!(
        <h1>"High-Five counter: {count}"</h1>
        <button onclick={move |_| count += 1}>"Up high!"</button>
        <button onclick={move |_| count -= 1}>"Down low!"</button>
    ))
}

Note that unlike HTML and JSX, styling of html tags is done via attributes:

html!(
    <h1 color="red">"High-Five counter: {count}"</h1>
)
Commit count: 24

cargo fmt