React：我可以在列表之外使用 `key` 吗？ [复制]

Question

沙盒：https://codesandbox.io/s/young-fog-cpjg15?file=/src/App.tsx

我有一个带有项目表和侧边栏的 React 应用程序，用户可以在其中编辑所选项目。输入字段是controlled components。表中的值在输入模糊之前不应更新，这就是输入使用本地 value 而不是简单的 <input value={item[field]} /> 的原因。

当然，value应该是初始化作为item[field]。问题：setState 不像其他 Hooks 那样接受依赖项数组，所以我没有办法告诉 React 输入值更改和所选项目更改之间的区别（后者应该重置 @987654328 @newItem[field]）。

我能够通过在父侧边栏组件中添加 key={item.id} 来解决这个问题，这会重置它包含的 <Input> 组件的生命周期。不过，这与通常使用 key 的方式不同。

key 的这种用法可以吗，还是有更惯用的方法来解决这个问题？

Answer 1

在问这个之前我应该​​更努力地谷歌搜索；留下它以防它帮助别人。新的 React 文档说这是可以的：https://beta.reactjs.org/apis/react/useState#resetting-state-with-a-key