使用 typescript react 在 onclick 函数上去抖动答案

【问题标题】：Debounce on a onclick function using typescript react使用 typescript react 在 onclick 函数上去抖动
【发布时间】：2023-02-02 16:31:41
【问题描述】：

我正在尝试在 onclick 函数上实现 lodash debounce 函数，以避免多次点击按钮。我想出的解决方案如下：

function saveForm() {
//do stuff here
}

<Button onClick={debounce(() => saveForm, 1500, {
              maxWait: 2000 })}>
              SAVE
</Button>

我见过许多示例，其中对返回之外的函数执行去抖动，然后仅在 onclick 下使用该去抖动函数。在按钮元素上直接（内联）执行去抖是错误的做法吗？

【问题讨论】：

标签： reactjs typescript debouncing

【解决方案1】：

如果你的组件经常重新渲染，我认为它可以替换为useCallback，但在正常情况下，我认为你的用例看起来还不错。

【讨论】：

【解决方案2】：

取而代之的是，您可以添加一个加载状态，并根据该加载状态禁用该按钮。

【讨论】：