如何拥有一个既能输入又能点击按钮的功能

Question

我有这个输入和一个提交按钮：

<input onKeyDown={handleEnter} value={inputValue} onChange={(nv) => setInputValue(nv.currentTarget.value)} /> <button onClick={handleClick}>Submit</button>

触发一个功能：

const handleEnter = (e) => {
if (e.key === 'Enter') {
handleSubmit()
}
}

然而，现在我必须为onClick定义另一个单独的函数来处理按钮。这似乎是DRY的情况(不要重复(，我想知道如何使用相同的功能同时单击按钮和按enter来处理该值。

Answer 1

传递handleSubmit作为点击事件处理程序，并创建一个单独的函数来测试按下了什么键，然后调用handleSubmit，这并不重复。

所有的逻辑；相同的"；被封装在CCD_ 4函数中。

---

也就是说，您可能应该将表单控件包装在<form>中，只使用其submit事件。(请注意，您需要致电e.preventDefault().