Function use_throttle

Source
pub fn use_throttle<'hook, Callback>(
    callback: Callback,
    millis: u32,
) -> impl 'hook + Hook<Output = UseThrottleHandle>
where Callback: FnMut() + 'static + 'hook,
Expand description

A hook that throttles invoking a function, the function is only executed once every millis.

§Example

use yew_hooks::prelude::*;

#[function_component(Throttle)]
fn throttle() -> Html {
    let state = use_state(|| 0);

    let throttle = {
        let state = state.clone();
        use_throttle(
            move || {
                state.set(*state + 1);
            },
            2000,
        )
    };

    let onclick = {
        let throttle = throttle.clone();
        Callback::from(move |_| throttle.run())
    };

    let oncancel = { Callback::from(move |_| throttle.cancel()) };

    html! {
        <>
            <button {onclick}>{ "Click fast!" }</button>
            <button onclick={oncancel}>{ "Cancel throttle" }</button>
            <b>{ "State: " }</b> {*state}
        </>
    }
}

§Note

When used in function components and hooks, this hook is equivalent to:

pub fn use_throttle<Callback>(callback: Callback, millis: u32) -> UseThrottleHandle
where
    Callback: FnMut() + 'static,
{
    /* implementation omitted */
}