Javascript 将HTMLFormElement.reset（）与降档和反应挂钩形式一起使用

我正在使用Downshift JS使用

useCombobox

hook创建一个自动完成组件。一切都进行得很顺利，并使用

react-hook表单进行了测试。不幸的是，我遇到了一个问题，即触发
HTMLFormElement.reset（）
方法的
react hook form
中可用的重置函数不会触发降档组件中的任何状态/输入更改

这意味着，当用户从列表中选择一个项目（触发
自动完成
中的一个事件）时，单击重置按钮，然后再次单击输入，列表将被过滤为仅先前选择的项目。这是因为所选项目存储在
selectedItem
内部状态中

如何获取重置方法以触发
Autocomplete
组件内的更改并清除
selectedItem
状态

我已经隔离了该问题。
您可以使用
React.useffect
检测用户是否点击重置按钮，并相应地重置
自动完成组件中的选定项目

const[inputItems，setInputItems]=useState（选项）；
常数{
输入值，
...
}=使用组合框({
项目：输入项，
...
});
React.useffect（（）=>{
如果（！inputValue）{
//用户重置值。重置所选选项
设置输入项（选项）；
}
}，[inputValue，options，setInputItems]）；

现场演示
您可以使用
React.useffect
检测用户是否点击重置按钮，并相应地重置
自动完成组件中的选定项目

const[inputItems，setInputItems]=useState（选项）；
常数{
输入值，
...
}=使用组合框({
项目：输入项，
...
});
React.useffect（（）=>{
如果（！inputValue）{
//用户重置值。重置所选选项
设置输入项（选项）；
}
}，[inputValue，options，setInputItems]）；

现场演示
谢谢。这是因为我关心selectedItem中的值，实际上，没有人需要担心selectedItem状态中的内容。可以从inputValue获取值。谢谢。这是因为我关心selectedItem中的值，实际上，没有人需要担心selectedItem状态中的内容。可以从inputValue中获取该值。