javascript - 如何消除多个可点击按钮的抖动

Question

目前我正在使用 lodash library 去抖就像这样...

<Button
  onPress={_.debounce(
        () => {
               navigation.goBack()
              },
              500,
              {
                leading: true,
                trailing: false,
               }
   )}
   title="Back"
/>

当我只点击一个链接时，它会按预期工作，但如果我点击两个可点击区域，如下所示...(见下面的 gif)，则会发生以下情况...

Answer 1

从“render”方法中移动去抖动函数的定义，如下所示:

export default class YourClassName extends Component {
  constructor() {
    super();

    this.debouncedOnPressHandler = _.debounce(
      () => { navigation.goBack() },
      500,
      {
        leading: true,
        trailing: false,
      }
    )
  }

  render() {
    return (
      <div>
        <Button onPress={this.debouncedOnPressHandler} title="Back A" />
        <Button onPress={this.debouncedOnPressHandler} title="Back B" />
      </div>
    );
  }
}