摘要
React团队,
我最近尝试了React 19中的新表单操作,我试图在短时间内通过多个表单提交来重现竞争条件。然而,在连续几次提交后,我偶尔会收到错误TypeError Cannot read properties of null (reading 'queue')
。
经过一些调查,我可以创建以下最小可复现步骤:
function App() {
const formAction = async () => {
await new Promise((resolve) => setTimeout(resolve, 3000));
};
return (
<form action={formAction}>
<input type="text" name="name" />
<input type="submit" />
</form>
);
}
export default App;
- 在文本框中输入"1"
- 提交表单
- 在3秒内(在客户端操作解决之前),再次提交表单
预期行为:
表单字段重置。
实际行为:
页面中断,报告以下TypeError:
TypeError: Cannot read properties of null (reading 'queue')
requestFormReset$1
https://gwprwq.csb.app/node_modules/react-dom/cjs/react-dom-client.development.js:7001:74
eval
https://gwprwq.csb.app/node_modules/react-dom/cjs/react-dom-client.development.js:6956:15
startTransition
https://gwprwq.csb.app/node_modules/react-dom/cjs/react-dom-client.development.js:6908:27
startHostTransition
https://gwprwq.csb.app/node_modules/react-dom/cjs/react-dom-client.development.js:6948:7
listener
https://gwprwq.csb.app/node_modules/react-dom/cjs/react-dom-client.development.js:16008:21
processDispatchQueue
https://gwprwq.csb.app/node_modules/react-dom/cjs/react-dom-client.development.js:16066:17
eval
https://gwprwq.csb.app/node_modules/react-dom/cjs/react-dom-client.development.js:16665:9
batchedUpdates$1
https://gwprwq.csb.app/node_modules/react-dom/cjs/react-dom-client.development.js:2689:40
dispatchEventForPluginEventSystem
https://gwprwq.csb.app/node_modules/react-dom/cjs/react-dom-client.development.js:16221:7
dispatchEvent
https://gwprwq.csb.app/node_modules/react-dom/cjs/react-dom-client.development.js:20127:11
dispatchDiscreteEvent
https://gwprwq.csb.app/node_modules/react-dom/cjs/react-dom-client.development.js:20095:11
我漏掉了什么吗?谢谢。
2条答案
按热度按时间gjmwrych1#
感谢您的反馈。Codesandbox对我来说无法加载,所以我创建了一个新的。我们也可以通过点击提交按钮来重现这个问题:
Screen.Recording.2024-06-25.at.10.33.38.mov
-- https://codesandbox.io/p/sandbox/confident-sky-8vr69k
ckocjqey2#
感谢您修复了Codesandbox。顺便说一下,我使用的React是
19.0.0-rc-3563387fe3-20240621
。