首页 > 解决方案 > 如何禁用第二次单击按钮

问题描述

我有一个在 中打开模式的按钮framework7,但是如果双击,模式会打开两次,我试图不允许双击该按钮而没有运气。

$(Button, {
  fill: true,
  raised: true,
  noFastClick: true,
  onClick: this.handle_click
})

const clickTimes: any[] = []

handle_click = (button) => {
   const clickTime = new Date().getTime()
   clickTimes.push(clickTime)
   if (clickTimes.length > 1) {
       console.log("double click detected")
       button.disabled = true
       clickTimes.length = 0
       return
   }
}

任何帮助,将不胜感激。

标签: javascriptreactjsecmascript-6ecmascript-5html-framework-7

解决方案


因为,您已经在记录点击次数。当模式打开时禁用按钮并在模式关闭后启用它怎么样?

return <button
  type='button'
  className={
    this.state.isModalActive ? 'disable' : ''
  }
  onClick={ this.handleClick }
>

确保在每次与按钮交互时更新状态isModalActive 。


推荐阅读