问题标签 [react-final-form-arrays]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
0 回答
53 浏览

react-final-form - 如何防止将重复值添加到 react-final-form-array 中?

我让用户定义选项并将它们添加到数组中。我想防止用户添加重复值,但我找不到如何知道数组字段的表单状态。

我试过了,const formState = useFormState('array-field-name');但我无法访问值。

0 投票
0 回答
91 浏览

reactjs - 为什么使用变量命名 react-final-form 组件会导致无限循环?

react-final-form我有一些代码为外部 JSON API 返回的每个条目创建一个表单。

我试图使用一个变量i来设置一个Control'd Inputchakra 组件的名称。(此组件的定义是从带有脉轮示例的react-final-form 复制而来)。i将在来自 API 的数组项的循环中递增。这以某种方式导致了无限循环。(return语句中的这段代码在示例代码中有注释)

但是,如果我只设置没有i变量的名称,一切正常。

我试图理解为什么使用i会导致无限循环?

我想使用i某种方式会导致Form以某种方式改变状态/重新渲染,但我现在确定如何/为什么会发生这种情况?

这是重现问题的笔: https ://codepen.io/growinman/pen/GRmGyxX?editors=1010

(代码原样工作正常,但如果我使用注释返回语句,它会导致无限循环)

任何帮助,将不胜感激!

这是代码的内联副本:

0 投票
0 回答
46 浏览

semantic-ui - 语义 React UI 控制的组件不适用于 React Final Form

这个问题也在https://github.com/final-form/react-final-form/issues/939的 react-final-form github 问题列表中提出

我正在使用 Semantic React UI 2.02 和 react-final-form 6.5.3。

首要问题

我在一个组件上有一个受控的 Semantic React UI 下拉菜单,该组件从父级获取其值。如果我将 Dropdown 组件直接放入 React Final Form Field 中,它会按预期工作。我可以通过更新状态值来清除下拉列表中当前选择的值。但是当我使用一个组件时,你可以看到它忽略了父母试图对状态做出的任何改变。

不幸的是,没有多少例子可以帮助指导我。

第二期

问题已在 6.3.1 中“修复”,但似乎仍然存在。

第544章

如果我尝试将多个传递给自定义组件,则该值将被忽略并且始终为 false。

在此处链接到沙箱https://codesandbox.io/s/semantic-react-ui-react-final-form-how-to-clear-dropdown-4l17f?file=/src/index.tsx

第三个问题 如果您实现一个向导表单并在其中一个表单上使用 Semantic React UI 下拉菜单。当您尝试向后移动时,下拉列表中选择的值会丢失。想不出办法重新设置它。

会感谢其他用户的智慧。提前致谢。

0 投票
1 回答
47 浏览

reactjs - React final 表单如何添加子表单

让沙箱与有效的 React 表单数组 https://codesandbox.io/s/react-final-form-field-arrays-react-beatiful-dnd-as-drag-drop-forked-uz24z?file=/index.js :5933-6061

单击添加热点并生成数据树的结果为

但是当单击“添加热点”按钮(到 values.customers 数组的相同索引)时,我需要将热点添加为客户的子项,例如

添加热点是在 index.js 的第 174 行添加的 如何修改代码以分别为每个客户添加热点?