javascript - 将字段动态添加到 Formik 表单
问题描述
我需要一种在 for 循环中将字段添加到 Formik 表单的方法。我已经阅读了 FieldArray 组件的文档,但我并不真正了解如何使用它。这是我当前的代码:
function generate(values) {
for (let i = 0; i < 10; i++) {
values.test.push({
hello: "world"
})
}
}
return (
<div>
<Formik initialValues={{test: []}}/>
{(values)=>(
<Form>
<FieldArray>
{()=>generate(values)}
<p>{JSON.stringify(values)}</p>
</FieldArray>
</Form>
)}
</div>
)
目前,它只显示一个空白页面。甚至没有错误消息。
解决方案
您上面的代码不起作用的原因是因为您正在调用字段数组并在<Formik />
它应该是:
<Formik render={({ values }) => (
<Form>
<FieldArray />
</Form>
)/>
并不是:
<Formik initialValues={{test: []}} />
<Form>
<FieldArray />
</Form>
你可以在这里看到一个更清晰的例子:https ://codesandbox.io/s/1o8n593z6q
推荐阅读
- javascript - Ajax 请求问题,3 次返回未定义的 2 次
- java - 如果键可以通过基于最大匹配的检索开始支持“*”,我们如何压缩表中的条目数
- sql - 如何通过 PostgreSQL 更新特定列的特定行以反映另一个表中的值?
- docker - 无法准备上下文:无法评估 Dockerfile 路径中的符号链接:lstat /var/lib/snapd/void/Dockerfile:没有这样的文件或目录
- kubernetes - 将 gitlab 连接到 Rancher 中托管的 kubernetes 集群
- python - 将列表与重叠元素组合
- python - 导入适用于 Python 的 Google Cloud Talent Solution
- java - 大量并发操作的 Infinispan 缓存不一致
- ruby - 安装 Nokogiri 时出现 GCC 编译错误
- sql - Hive SQL-向现有时间戳添加(不附加)秒