Children

Children is a special prop type that allows you to recieve nested Html that is provided like html child elements.

  1. use yew::{function_component, html, Html, Properties, Children};
  2. #[function_component]
  3. fn App() -> Html {
  4. html! {
  5. <HelloWorld>
  6. <span>{"Hey what is up ;)"}</span>
  7. <h1>{"THE SKY"}</h1>
  8. </HelloWorld>
  9. }
  10. }
  11. #[derive(Properties, PartialEq)]
  12. pub struct Props {
  13. pub children: Children, // the field name `children` is important!
  14. }
  15. #[function_component]
  16. fn HelloWorld(props: &Props) -> Html {
  17. html! {
  18. <div class="very-stylized-container">
  19. { for props.children.iter() } // you can forward children like this
  20. </div>
  21. }
  22. }

Further reading