繁体   English   中英

当使用 react-final-form 从表单数组中删除元素时,显示的值<input>不更新,但最终形式的数据对象会

[英]when removing element from form array with react-final-form, the displayed value of the <input> does not update, but final-form data object does

这是一个奇怪的情况。 我简化了一个 react-final-form-array 示例,它允许我向表单添加元素,并且可以扩展对象数组。 它与 react-final-form-arrays 提供的简单示例非常相似。 该数组工作得很好,但我遇到的问题是,当我尝试删除特定元素时,输入中显示的实际值不会改变。 例如,使用图像:

基本形式数组示例

在这里我们可以看到我可以将客户添加到一个列表中,该列表生成一个对象数组。 这很好用。 现在,假设我想摆脱第一个元素。 我点击 X,会发生什么?

从列表中删除元素

在这里我们可以看到表单数据正确删除了我想要删除的第一个元素,但是,输入中显示的实际值仍然是 John Doe,尽管表单知道它是 Mary Jane。 当我点击输入时,它们似乎更新为正确的值。 但这不是应该发生的事情。

最奇怪的是,我制作了一个代码和盒子,你可以在这里看到https://codesandbox.io/s/agitated-wilson-5xlqq

它具有与我的应用程序完全相同的代码,并且按预期工作! 所以我什至无法重新创建错误,并且我确保依赖项与我使用的版本相同。 我只能在我自己的设置中重新创建它,我不明白为什么会这样。

我尝试过 chrome、safari 和 firefox,它们似乎都在我的电脑上做同样的事情,我什至通过连接到我的笔记本电脑上运行的反应服务器来尝试在我的手机上,它们都表现出相同的行为。

我不知道我可能是什么,版本,反应,如果有人有任何想法或过去有类似的问题,请帮助。 我不会在这里粘贴我的代码,以免使这篇文章膨胀,但您可以看到它与我上面链接的沙箱中的代码完全相同。

编辑:我想指出另一个发生的错误,那就是一旦我删除了第一个元素,如果我尝试编辑它,它会将另一个字段推入我刚刚添加的输入的数组中,就好像它被绑定了一样。 我希望我能在 codeandbox 上重新创建它

尝试删除您的 node_modules 文件夹并重新安装它们。 您是否在控制台日志中看到任何错误?

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM