问题标签 [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 投票
1 回答
4420 浏览

angular - Angular 5 FormArray get data from database and show rows

I am just a newbie to angular. I have create a event component where user enters the event name with packages. When user creates an event it has the functionality for creating multiple packages with add and remove row. For that I have used FormArray.

Everything is fine here. But when I am trying to get those values in event edit component I am getting the value of event name but when I am trying to get the packages details I am little bit confused in showing rows with filled values.

Here is the code what I have done so far

event-edit.component .ts looks like this

event-edit.component.html looks like this

0 投票
2 回答
3296 浏览

javascript - 如何在数组react-final-form中设置错误

我对 react-final-form 中的错误有一些问题。我不知道如何在数组中设置错误。有人可以给我一个例子吗?谢谢。

只需为此示例设置验证。 https://codesandbox.io/s/kx8qv67nk5

0 投票
1 回答
1399 浏览

reactjs - 如何将`final-form-calculate`与`final-form-array`结合起来

我有一个表格,用于react-final-form-array有许多“与会者”。我希望每个 Attendee.Email 输入进行网络查找,然后根据结果设置 Attendee.FirstName 和 Attendee.Surname。

我不确定这应该如何用final-form-calculate装饰器来表达。具体来说,我不知道如何引用数组中的单个表单项。

这是我的开始:

0 投票
1 回答
858 浏览

reactjs - 验证器不是函数错误 - 对最终表单字段数组做出反应

我正在尝试在我的 React App 中使用 final-form-field-arrays 组件。当我尝试使用它时,我得到一个“验证器不是函数错误”。

我将其追溯到 final-form.es.js 中的 runFieldLevelValidation 函数

有问题的行是

记录字段后(如上所示),我发现 FieldArray 字段本身没有验证器函数,而是有一个 getValidator 函数。我给它打了补丁,它正在工作,但我认为这不应该是必需的

我有问题的反应代码是

关于如何在没有猴子补丁的情况下使其工作的任何想法?

0 投票
0 回答
980 浏览

javascript - 有什么方法可以禁用仅输入而不是语义ui中的标签输入反应

我们正在使用语义 UI 来响应表单。

当我使用 disable forInput时,它同时禁用标签和输入字段。

我像下面这样使用

有没有办法只禁用输入框而不是标签?

提前致谢 :)

0 投票
2 回答
672 浏览

reactjs - 添加多个表单域,但一次只显示一个

我需要final-form能够添加表单字段记录数组。但是一次只显示一个数组字段。就像在左侧我将有客户idindex哪个用户将选择,在右侧我必须显示与该客户相对应的客户index。我可以添加reac-final-form-array,但它总是显示所有数组元素。什么应该是仅显示选定客户的正确方法。

请检查以下代码以供参考。希望我的问题很清楚,如果没有,请告诉我,将添加更多解释。

添加新客户:

目前它看起来像:

在此处输入图像描述

我需要它看起来像这样: 在此处输入图像描述

0 投票
1 回答
1661 浏览

reactjs - props.mutators 已弃用

我的代码正在运行,但我收到了警告:

警告:从 React Final Form v3.3.0 开始,props.mutators 已被弃用,并将在 React Final Form 的下一个主要版本中删除。改用:props.form.mutators。检查你的 ReactFinalForm 渲染道具。

用这个例子:

https://codesandbox.io/s/kx8qv67nk5

如何做正确的方法?

0 投票
1 回答
4057 浏览

reactjs - 最终表单数组字段异步验证

我正在尝试实现异步验证react-final-form-array。但它的回报承诺但根本没有显示错误。

我参考了这段代码进行 asnyc 验证,并在此处使用最终表单数组创建了我自己的版本。

形式:

验证功能:

0 投票
1 回答
68 浏览

javascript - React Router 的 ES6 导入错误

我遇到的错误非常令人困惑,以至于我不知道在哪里寻找解决方案,而且这些错误令人担忧,因为它们似乎隐藏在图书馆的深处。
我正在使用样板应用程序 ( react-boilerplate) 和表单库 ( react-final-forms, react-final-form-arrays) - 导入时会导致错误和奇怪的行为。可重现的步骤如下。

  1. 从应用程序正常运行的状态:
  2. import { FieldArray } from 'react-final-form-arrays'到我的主页
  3. 热重载时,主页重新渲染失败,因此页眉和页脚显示但主页不重新渲染,但控制台上没有错误。如果刷新页面,结果相同
  4. 导航到另一个页面,然后导航回主页——现在使用路由器——这会引发错误(注意页面上尚未使用导入):

react.development.js?72d0:207 警告:React.createElement:类型无效 - 需要一个字符串(对于内置组件)或一个类/函数(对于复合组件)但得到:对象。

检查LoadableComponent. 在 LoadableComponent(由 Route 创建) 在 Route(由 App 创建) 在 Switch(由 App 创建) 在 div(由 Context.Consumer 创建) 在 StyledComponent(由 App__AppWrapper 创建) 在 App 中 在 Router(由 ConnectedRouter 创建) 在 ConnectedRouter(由创建by Connect(ConnectedRouter)) in Connect(ConnectedRouter) in IntlProvider (由 LanguageProvider 创建) 在 LanguageProvider (由 Connect(LanguageProvider) 创建) in Connect(LanguageProvider) 在 Provider

  1. 删除导入,一切恢复正常。

围绕花括号导入的问题通常被回答为命名导入和默认导入之间的区别一样简单。显然这里的事情更复杂。(我都试过了,但它肯定应该被命名)。问题与加载脚本有关吗?

0 投票
2 回答
2940 浏览

reactjs - 如何为使用的数组设置初始/默认值?

我一直在用 react-final 形式创建一个表单。此表单有一些条件字段,仅在用户单击复选框时显示。如果选中该复选框,则呈现一个组件。

它与他们在文档中提供的示例非常相似,您可以在此处查看。https://codesandbox.io/s/kx8qv67nk5

我以该示例为基础,并且可以使用调用 push 方法的按钮将其添加到字段数组中,就像示例中一样。

我想做的不是必须按下按钮才能将该对象推入数组,而是让数组默认值已经包含一个对象。

换句话说,

在提供的示例中,数组开始为空,然后您将 push() 放入数组中,其中定义的字段

我怎样才能让它默认已经默认拥有一个对象而不是手动推送它?

我不确定该数组在哪里被定义或初始化。