Throttled

A wrapper over `useThrottle` that returns a throttled state.

Demo

Search for something above!

Usage

This is a simple wrapper over useThrottle that returns a throttled state.

	<script lang="ts">
  import { Throttled } from "runed";
 
  let search = $state("");
  const throttled = new Throttled(() => search, 500);
</script>
 
<div>
  <input bind:value={search} />
  <p>You searched for: <b>{throttled.current}</b></p>
</div>	

You may cancel the pending update, or set a new value immediately. Setting immediately also cancels any pending updates.

	let count = $state(0);
const throttled = new Throttled(() => count, 500);
count = 1;
throttled.cancel();
// after a while...
console.log(throttled.current); // Still 0!
 
count = 2;
console.log(throttled.current); // Still 0!
throttled.setImmediately(count);
console.log(throttled.current); // 2	
MIT

© 2024 Svecosystem Team