leptos_use

Function use_mutation_observer

Source
pub fn use_mutation_observer<El, T, F>(
    target: El,
    callback: F,
) -> UseMutationObserverReturn<impl Fn() + Clone>
where El: Into<ElementsMaybeSignal<T, Element>>, T: Into<Element> + Clone + 'static, F: FnMut(Vec<MutationRecord>, MutationObserver) + 'static,
Expand description

Reactive MutationObserver.

Watch for changes being made to the DOM tree.

§Demo

Link to Demo

§Usage

let el = create_node_ref::<Pre>();
let (text, set_text) = create_signal("".to_string());

use_mutation_observer_with_options(
    el,
    move |mutations, _| {
        if let Some(mutation) = mutations.first() {
            set_text.update(|text| *text = format!("{text}\n{:?}", mutation.attribute_name()));
        }
    },
    UseMutationObserverOptions::default().attributes(true),
);

view! {
    <pre node_ref=el>{ text }</pre>
}

§Server-Side Rendering

On the server this amounts to a no-op.