component

Attribute Macro component 

Source
#[component]
Expand description

Macro which transforms a provided function into a component that can be used in dom! macro

use vertigo::prelude::*;

#[component]
pub fn Header(name: Value<String>) {
    dom! {
        <div>"Hello" {name}</div>
    }
}

let name = Value::new("world".to_string());

dom! {
    <div>
       <Header name={name} />
    </div>
};
use vertigo::{bind, component, dom, AttrGroup, Value};

#[component]
pub fn Input<'a>(label: &'a str, value: Value<String>, input: AttrGroup) {
    let on_input = bind!(value, |new_value: String| {
        value.set(new_value);
    });

    dom! {
        <div>
            {label}
            <input {value} {on_input} {..input} />
        </div>
    }
}

let value = Value::new("world".to_string());

dom! {
    <div>
       <Input label="Hello" {value} input:name="hello_value" />
    </div>
};

Note: AttrGroup allows to dynamically pass arguments to some child node.