在React中,可以使用ref
来获取DOM元素的引用,并在需要时将焦点设置回输入字段。以下是一个示例:
import React, { useRef } from 'react';
function MyForm() {
const inputRef = useRef(null);
const handleReset = () => {
// 重置表单逻辑...
// 将焦点设置回输入字段
inputRef.current.focus();
};
return (
<form>
<input type="text" ref={inputRef} />
<button type="reset" onClick={handleReset}>重置</button>
</form>
);
}
export default MyForm;
在上面的示例中,我们使用了useRef
来创建一个inputRef
引用。在重置按钮的点击事件处理函数handleReset
中,我们可以执行重置表单的逻辑,并通过inputRef.current.focus()
将焦点设置回输入字段。
这样,当用户点击重置按钮后,表单会被重置,并且焦点会自动返回到输入字段,方便用户继续输入。
推荐的腾讯云相关产品:无
希望以上信息能对您有所帮助!如有更多问题,请随时提问。
领取专属 10元无门槛券
手把手带您无忧上云