Struct leptos::NodeRef

pub struct NodeRef<T>(_)
where
         T: ElementDescriptor + 'static;

Contains a shared reference to a DOM node created while using the view macro to create your UI.

use leptos::html::Input;

#[component]
pub fn MyComponent(cx: Scope) -> impl IntoView {
    let input_ref = create_node_ref::<Input>(cx);

    let on_click = move |_| {
        let node =
            input_ref.get().expect("input_ref should be loaded by now");
        // `node` is strongly typed
        // it is dereferenced to an `HtmlInputElement` automatically
        log!("value is {:?}", node.value())
    };

    view! {
      cx,
      <div>
      // `node_ref` loads the input
      <input _ref=input_ref type="text"/>
      // the button consumes it
      <button on:click=on_click>"Click me"</button>
      </div>
    }
}

Implementations

impl<T> NodeRef<T>where T: ElementDescriptor + 'static,

pub fn new(cx: Scope) -> NodeRef<T>

👎Deprecated: Use create_node_ref instead of NodeRef::new().

Creates an empty reference.

pub fn get(&self) -> Option<HtmlElement<T>>where T: Clone,

Gets the element that is currently stored in the reference.

This tracks reactively, so that node references can be used in effects. Initially, the value will be None, but once it is loaded the effect will rerun and its value will be Some(Element).

pub fn on_load<F>(self, cx: Scope, f: F)where T: Clone, F: FnOnce(HtmlElement<T>) + 'static,

Runs the provided closure when the NodeRef has been connected with it’s HtmlElement.

Trait Implementations

impl<T> Clone for NodeRef<T>where T: ElementDescriptor,

fn clone(&self) -> NodeRef<T>

Returns a copy of the value.

fn clone_from(&mut self, source: &Self)

Performs copy-assignment from source.

impl<T> Copy for NodeRef<T>where T: ElementDescriptor + 'static,