Macro virtual_dom_rs::html

source ·
macro_rules! html {
    ($($remaining_html:tt)*) => { ... };
}
Expand description

A macro which returns a root VirtualNode given some HTML and Rust expressions.

Examples


use virtual_dom_rs::VirtualNode;

let click_message = "I was clicked!";
let some_component = html! { <div !onclick=move |_ev| { println!("{}", click_message); },></div> };

// Create lists of nodes from data!
let list: Vec<VirtualNode> = [0, 1, 2].iter().map(|index| {
  let index = index.to_string();
  html! {
    <div key="unique-key-{index}",>
      <h1> {"This is node number"} {index} </h1>
      <strong> {"Keys in lists help performance"} </strong>
      <em> { "But they're optional" } </em>
    </div>
  }
}).collect();

let root_node = html! {
 <div id="my-app", !onmouseenter=|_ev|{},>
  <span> { "Hello world" } </span>
  <b> { "How are" "you?" } </b>

  { html! { <strong> { "nested macro call!" } </strong> } }

  { some_component }

  { list }

  // You can have
  /*  comments in your html! */
 </div>
};

TODO

Create a separate macro that works with anything that implements VNode

struct MyCustomVirtualNode;
impl VNode for MyCustomVirtualNode {
  ...
}

html_generic ! { MyCustomVirtualNode <div> <span></span> </div> };

Then make html! { <div></div> } call html_generic! { $crate::VirtualNode <div></div> }.

This would allow anyone to use the html_generic! macro to power their own virtual dom implementation!