throttle-debounce 使用

安装 3版本

npm install throttle-debounce@3 --save

throttle 节流

单位时间内只触发一次回调

throttle(delay, noTrailing, callback, debounceMode)
  • delay number 延迟\间隔 时间 单位毫秒
  • noTrailing boolean 最后一次是否不执行,默认false 执行。(比如:delay为3秒,三秒中点击的5五次,只有第一次会触发,noTrailing 判断第五次是否在3秒后执行)
  • callback 回调函数
  • debounceMode boolean 是否开启防抖模式, 只有三种状态: true 、false、undefined(默认)

throttle 节流模式都会立即执行,区别是 最后一次 是否在下一个时间间隔执行

debounceMode true false undefined
noTrailing
true 点击就执行 不会执行 节流模式,最后一次不执行
false 防抖模式 立即执行 防抖模式 延迟后执行 节流模式,最后一次执行

debounce 防抖

间隔单位时间后触发回调,多次debounce会导致重新开始计算隔间事件

debounce(delay, atBegin, callback)
  • delay number 延迟\间隔 时间 单位毫秒
  • atBegin boolean 是否立即执行,默认false 不执行。(立即执行回调还是等 delay 时间后再执行)
  • callback 回调函数

使用

import { throttle,debounce } from 'throttle-debounce'
tupain tupain
posted @ 2022-05-25 17:29  雨天。我  阅读(1909)  评论(0)    收藏  举报