Struct ElementBuilder

pub struct ElementBuilder { /* private fields */ }

Build an HTML element.

Implementations

impl ElementBuilder

pub fn new(tag: impl AsRef<str>) -> Self

pub fn attribute<T>( self, name: impl AsRef<str>, value: impl AttributeValue<T>, ) -> Self

Set an attribute. Attribute values can be reactive.

pub fn child(self, child: impl Into<Element>) -> Self

Add a child element after existing children. The child element can be reactive.

pub fn text(self, child: impl Text) -> Self

Add a text node after existing children. The text node can be reactive.

pub fn effect<T>(self, child: impl Effect<T>) -> Self

Apply an effect after the next render. For example, to set the focus of an element:

element.effect(|elem: &HtmlInputElement| elem.focus().unwrap());

Effects can be reactive. For example, to set the visibibilty of an item based on a hidden boolean signal:

let hidden = Signal::new(false);
let is_hidden = hidden.read();

element.effect(is_hidden.map(|&hidden| move |elem: &HtmlInputElement| elem.set_hidden(hidden)));

pub fn on(self, name: &'static str, f: impl 'static + FnMut(JsValue)) -> Self

Register an event handler.

name is the name of the event. See the MDN Events page for a list.

f is the callback when the event fires and will be passed the javascript Event object.

Trait Implementations

impl Builder for ElementBuilder

type Target = Element

fn build(self) -> Self::Target

fn into_element(self) -> Element

impl DomElement for ElementBuilder

type Target = Element

fn dom_element(&self) -> Self::Target

impl From<ElementBuilder> for Element

fn from(builder: ElementBuilder) -> Self

Converts to this type from the input type.