Struct leptos::HtmlElement

source ·

pub struct HtmlElement<El>where
    El: ElementDescriptor,{ /* private fields */ }

Expand description

Represents an HTML element.

Implementations§

source §

impl<El> HtmlElement<El>where El: ElementDescriptor + 'static,

source

pub fn with_view_marker(self, marker: impl Into<String>) -> HtmlElement<El>

Adds an optional marker indicating the view macro source.

source

pub fn into_any(self) -> HtmlElement<AnyElement>

Converts this element into HtmlElement<AnyElement>.

source

pub fn id(self, id: impl Into<Cow<'static, str>>) -> HtmlElement<El>

Adds an id to the element.

source

pub fn node_ref(self, node_ref: NodeRef<El>) -> HtmlElement<El>where HtmlElement<El>: Clone,

Binds the element reference to NodeRef.

source

pub fn on_mount( self, f: impl FnOnce(HtmlElement<El>) + 'static ) -> HtmlElement<El>

Runs the callback when this element has been mounted to the DOM.

Important Note

This method will only ever run at most once. If this element is unmounted and remounted, or moved somewhere else, it will not re-run unless you call this method again.

source

pub fn is_mounted(&self) -> bool

Checks to see if this element is mounted to the DOM as a child of body.

This method will always return None on non-wasm CSR targets.

source

pub fn attr( self, name: impl Into<Cow<'static, str>>, attr: impl IntoAttribute ) -> HtmlElement<El>

Adds an attribute to this element.

source

pub fn class( self, name: impl Into<Cow<'static, str>>, class: impl IntoClass ) -> HtmlElement<El>

Adds a class to an element.

Note: In the builder syntax, this will be overwritten by the class attribute if you use .attr("class", /* */). In the view macro, they are automatically re-ordered so that this over-writing does not happen.

Panics

This directly uses the browser’s classList API, which means it will throw a runtime error if you pass more than a single class name. If you want to pass more than one class name at a time, you can use HtmlElement::classes.

source

pub fn classes(self, classes: impl Into<Cow<'static, str>>) -> HtmlElement<El>

Adds a list of classes separated by ASCII whitespace to an element.

source

pub fn dyn_classes<I, C>( self, classes_signal: impl Fn() -> I + 'static ) -> HtmlElement<El>where I: IntoIterator<Item = C>, C: Into<Cow<'static, str>>,

Sets the class on the element as the class signal changes.

source

pub fn style( self, name: impl Into<Cow<'static, str>>, style: impl IntoStyle ) -> HtmlElement<El>

Sets a style on an element.

Note: In the builder syntax, this will be overwritten by the style attribute if you use .attr("class", /* */). In the view macro, they are automatically re-ordered so that this over-writing does not happen.

source

pub fn prop( self, name: impl Into<Cow<'static, str>>, value: impl IntoProperty ) -> HtmlElement<El>

Sets a property on an element.

source

pub fn on<E>( self, event: E, event_handler: impl FnMut(<E as EventDescriptor>::EventType) + 'static ) -> HtmlElement<El>where E: EventDescriptor + 'static,

Adds an event listener to this element.

source

pub fn optional_event<E>( self, event: E, event_handler: Option<impl FnMut(<E as EventDescriptor>::EventType) + 'static> ) -> HtmlElement<El>where E: EventDescriptor + 'static,

Optionally adds an event listener to this element.

Example

#[component]
pub fn Input(
    cx: Scope,
    #[prop(optional)] value: Option<RwSignal<String>>,
) -> impl IntoView {
    view! { cx, <input/> }
        // only add event if `value` is `Some(signal)`
        .optional_event(
            ev::input,
            value.map(|value| move |ev| value.set(event_target_value(&ev))),
        )
}

source