问题标签 [react-final-form]

我正在使用 Material-ui 和 React-final-form。一些表单元素是从浏览器缓存中预填充的，例如登录表单。问题是这并不会触发 React-final-form 中的 onChange 事件，从而使表单字段状态处于“空”状态，这在视觉上是有问题的。一旦触发渲染周期，React-final-form 就会接受更改并且 ui 很好。我想知道如何以编程方式触发它。

在我的应用程序中，我有两个文本字段，一个用于日期，一个用于时间。这些字段需要映射到startTime我的表单（日期类型）中的单个属性。是否有可能做到这一点？

我想使用具有多个提交按钮的 react-final-form构建一个表单，其中每个提交按钮在表单中设置不同的值。本质上，我想创建一个在呈现的 HTML 中看起来像这样的表单：

但是，我无法弄清楚如何让 react-final-form 将这些不同的提交按钮视为表单中的设置值。我尝试组合组件状态、<input type="hidden">和onClick处理程序，如下所示：

但是，这似乎不起作用——可能是因为组件上的value属性<Field>仅用于复选框和单选按钮。

有人可以给我一个正确的方向，如何正确解决这个问题吗？

我正在使用 React Final Form，出于某种原因，当我尝试将初始值传递给它的initialValuesprop 时，如果我使用的键是格式，它就不起作用'key6.value'-Field那个名称保持为空。但是，如果格式没有 . 在中间，例如'key6value'。

为什么 initialValues 不适用于这些嵌套字段（名称带有 . 的字段）？我该怎么做才能让它通过initialValues？

我已经对此进行了彻底的测试，以确保我发现了问题，并且填充字段和不填充字段之间的唯一区别是 . 在他们的name属性中。

我正在从 redux-form 迁移，我遇到了表单问题，我有异步验证。此验证发生在更改时，但我只想在用户停止输入时进行异步调用。

在 redux-form 中，我使用 setTimeout、clearTimeout 并在类似于此的异步验证中抛出错误

我已经创建了我希望能够工作的示例。完整示例可在此处获得。

Required如果没有值，则按预期工作，但Username taken!永远不会显示为错误。

我们正在使用 React Final Form 库，并希望在用户选择时更改嵌套字段的值。

它基本上是地址形式，在选择 时Suburb，我想更改postcode和state。address 在形式上又是一个嵌套对象。我的数据集看起来像：-

我正在通过以下 mutator

并将其称为

介绍：

• 我们在 react 中使用 formik 或 final-form 作为表单管理器
• 我们从 API 获取实体
• 我们需要映射该实体以编辑表单值

情况1：

• 实体具有 ISO 日期属性
• 我们使用一个日期选择器，它的 onChange 返回一个 JS 日期对象

我们应该在表单状态中存储什么：ISO 日期（字符串）或 JS 日期（对象）？

如果我们存储 ISO 日期，则必须在 onChange 处理程序中进行解析。

案例二：

• 实体具有布尔属性
• 我们使用 select 元素，其 onChange 返回一个字符串

我们应该在表单状态中存储什么：真（布尔）或“真”（字符串）？

一般的问题是：在表单状态中存储什么？

使用时可以解析的原始 onChange 值？

或者最好确保日期选择器始终返回 ISO 日期或未定义，布尔字段始终返回布尔或未定义等。

使用 React Final Form 时，有没有办法在不丢失 submitSucceeded 状态的情况下重置表单。我想在表单上显示一条成功消息，但我也想在成功提交后清除它。

从 react-final-form 传递到 Form 后，如何停止装饰器？如果字段被触摸和更改，我想停止自动计算字段。

反应很新，我正在使用反应进行表单验证。我尝试测试下面定义的 createTask()：

如何模拟 renderForm 以便我可以测试 createTask 已被调用？jest.fn() 对我不起作用，我做了如下

提前致谢