教程 radash tutorial

throttle

创建一个节流回调函数

基本用法

Throttle接受一个带有interval和源函数的选项对象。当返回的函数被调用时,只有在经过interval毫秒后才会调用源函数。否则,它将忽略这次调用。

ts
import { throttle } from 'radash'

const onMouseMove = () => {
  rerender()
}

addEventListener('mousemove', throttle({ interval: 200 }, onMouseMove))

时序

当interval为200时节流行为的可视化表示。由throttle返回的函数可以每毫秒调用一次,但它只会在经过interval毫秒后调用给定的回调。

sh
                时间: 0ms - - - - 100ms - - - - 200ms - - - - 300ms - - - - 400ms - - - -
节流函数调用: x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x - - -
  源函数调用: x - - - - - - - - - - - - x - - - - - - - - - - - - - x - - - - - -

是否节流中

由throttle返回的函数有一个isThrottled方法,调用该方法将返回是否有活跃的节流状态。

ts
const debounced = throttle({ interval: 200 }, onMouseMove)

// ... 稍后

debounced.isThrottled()