use_throttle_effect

Function use_throttle_effect 

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

A hook that throttles calling effect callback, it is only called once every millis.

§Example

use yew_hooks::prelude::*;

#[function_component(ThrottleEffect)]
fn throttle_effect() -> Html {
    let state = use_state(|| 0);
    let update = use_update();

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

    let onclick = { Callback::from(move |_| update()) };

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

§Note

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

/// A hook that throttles calling effect callback, it is only called once every `millis`.
///
/// # Example
///
/// ```rust
/// # use yew::prelude::*;
/// #
/// use yew_hooks::prelude::*;
///
/// #[function_component(ThrottleEffect)]
/// fn throttle_effect() -> Html {
///     let state = use_state(|| 0);
///     let update = use_update();
///
///     {
///         let state = state.clone();
///         use_throttle_effect(
///             move || {
///                 state.set(*state + 1);
///             },
///             2000,
///         )
///     };
///
///     let onclick = { Callback::from(move |_| update()) };
///
///     html! {
///         <>
///             <button {onclick}>{ "Click fast!" }</button>
///             <b>{ "State: " }</b> {*state}
///         </>
///     }
/// }
/// ```
pub fn use_throttle_effect<Callback>(callback: Callback, millis: u32)
where
    Callback: FnMut() + 'static,
{
    /* implementation omitted */
}