react jsx中的双击句柄问题

Question

我一直在youtube上学习React web应用程序的一系列教程。一切都很好，但当我试图得到双击处理工作。有人能帮我吗?这是代码

<main>
<p onDoubleClick={handleClick}>
Hello {handleNameChange()}!        
</p>
<button onClick={handleClick}>Click It</button>
<button onClick={() => handleClick2('Dave')}>Click It</button>
<button onClick={(e) => handleClick3(e)}>Click It</button>
</main>

所有的按钮工作，但双击部分的代码不注册任何东西，当我看控制台在chrome开发工具。有人知道是哪里出了问题吗?并且，handleNameChange函数可以工作(它只是显示一个随机的名称)，但是练习的想法是使名称为doublecklickable。

我已经查看了代码的拼写错误，从头开始重写代码-我需要一个提示，什么是错误的代码

Answer 1

不要使用onDoubleClick。相反，使用e.detail来获得点击次数。

<button onClick={(e) => {
if (e.detail === 2) handleDoubleClick()
}}>
"Click me"
</button>

这里有一个类似的线索，很好地解释了为什么你没有从onDoubleClick()得到你期望的结果。