如何制作可触摸不透明度按钮以防止多次单击

Question

我TouchableOpacity了不想执行两次的事件。

我试图将其onPress事件bool置于状态，但这不起作用，因为设置状态是异步的，我可以快速多次按下按钮。

我也尝试设置计时器，但这对我也不起作用。

有没有其他方法可以防止多次按下按钮（其他一些类似的组件等）？

Answer 1

无需setState来存储不会反映为 UI 更改的值。

您可以直接在 React 类中设置一个this.flag而不是this.state.flag，这是您在 TouchableOpacity 单击时设置的。 因此，您可以设置this.flag，而无需进行涉及渲染周期的异步操作。它只是您的组件持有的一个标志。

请参阅以下示例：

class SomeComponent extends React.Component{
  constructor() {
   super();
   this.state = { ... }; // this does not need to store our flag
   this.touchableInactive = false; // this is not state variable. hence sync
  }
  onButtonClick () {
    if (!this.touchableInactive) {
      this.touchableInactive = true;
      // do stuff
    }
  }
      // similarly reset this.touchableInactive to false somewhere else
}