问题标签 [formik-material-ui]

我有一个运行许多验证的模式。但是我不想在出现错误的情况下显示一些错误消息，尽管我希望突出显示该字段。给出空字符串而不是错误消息会导致 formik 不显示红色输入字段但验证运行。这是我当前的代码

我正在使用 Formik 创建表单。当我FieldArray以其中一种形式使用时，我收到错误消息Field.tsx:81 Uncaught TypeError: Cannot read property 'getFieldProps' of undefined

为了验证我是否做错了什么，我从文档中复制了示例并使用了它。不幸的是，文档中的示例不起作用。知道为什么它会出错吗？

这是我复制到我的项目中的示例，但它不起作用：https ://formik.org/docs/examples/field-arrays

我正在使用 Formik 表单，并且有一个非常简单的材质 UI 选择下拉列表：

对于三个菜单项，我希望值为 true、false 或 null，但对于 MenuItem 中的 value 字段，这些值是不可接受的。是我使用组件状态的唯一途径吗？我希望保持简单并坚持使用 Formik 状态和值，但不确定在这种情况下是否可行。

我试图弄清楚如何将 Material-UI Autocomplete 与 Formik 一起使用。

在这里，我创建了一个表单，每页显示 3 个问题字段，效果很好。

由于我对此很陌生并且不太了解Formik，因此我在使用这种类型的输入时遇到了麻烦。

所以我在这里做的是首先有一个条件，你选择（是或否）取决于你是否想回答这个问题。之后有自动完成下拉菜单，您可以从中选择多个选项。我遇到问题的部分是我不知道如何提交多个选定的选项。您从自动完成下拉列表中选择的选项将进入补救措施数组。

最后它应该返回如下内容：

所以我希望能够从自动完成中选择多个值并将它们填充到补救措施中：[] 数组。

FormikControl 是我做的另一件事，它只是一堆 switch 语句，它们根据传递的条件呈现某种类型的 Input。在这种情况下，它返回我在下面发布的输入组件。

表格：

输入组件：

任何帮助都非常受欢迎

我正在尝试创建一个 Formik 表单来创建一个简单的 userTable，我正在其中生成一个自动 ID，它在提交时工作正常。当我转到特定的 UserId 页面时，当单击编辑用户时，ID 输入字段在不应该编辑时再次变得可编辑。它具有禁用属性，这很好，但是单击编辑按钮时将其更改为可编辑，请问如何解决此问题？

谢谢

我有一个带有复选框组的表单，其中包含 4 个复选框。我需要在提交按钮时将值传递给我的 api，该按钮将通过 Formik 处理。

单击特定复选框有几个条件：

1. 如果检查了高度，则还应检查其余部分
2. 如果选择了宽度，除了高度之外都应该检查
3. 如果检查了长度，则应检查 Nos 和 Length

Nos 可以勾选或不勾选

目前，我正在为所有复选框声明单独的状态，并为上述每个条件声明单独的函数。

有没有其他方法可以将复选框中的值绑定到 Formik 并传递给 api

国家和个人职能：

使用 Formik 形成：

我正在构建一个表单并收到一个我不太理解的错误。

当我像这样使用 Material UI 中的 TextField

没有错误出现，输出和行为符合预期。

当我像这样使用Formik useFormik 文档中的标签和输入时

我收到以下错误

我想尝试 formik useFormik 中最简单的输入字段，以了解如何使用valueand更新每个输入字段的状态onChange，但如果没有此错误，我似乎无法将 TextField 转换为基本输入：/

我正在尝试在我的表单上创建图像上传。问题是当我尝试将值更改为实际上传的文件时。我正在尝试使用 setFieldValue，但它说它是未定义的。下面是代码。任何想法为什么它是未定义的？我以为它带有Formik。

我在我的 Formik 表单中使用 useFormik 钩子，这意味着，根据 docs，我不能使用<Field>, <FastField>, <ErrorMessage>, connect(), and <FieldArray>.

所以我一直从专门使用 MaterialUI TextField的formik 示例构建。它运行良好，但我无法弄清楚如何禁用/更改某些触摸行为以使 UI 更好。

我的目标是在触摸 TextField之前显示 TextInput 标签。

这就是我的意思。我当前用于名称输入的 TextField 代码如下所示...

...但是像这样渲染（在被触摸之前）。请注意，它没有明确的标签。

只有当字段被触摸时，标签才会呈现给用户（如下所示）。因此，用户开始查看一堆空字段，然后他们必须触摸它们以查看要输入的内容。

在同一文档源中引用的 formik 文本字段材料 ui 示例沙箱中未观察到此行为。

更进一步，当我将来自 Material UI 的 TextField 文档的示例代码放入我的 formik 表单时，最初也没有其他 TextField 变体上的标签。

这段代码

在 Material UI 演示中看起来像这样

以我的 formik 形式运行时看起来像这样。

现在我将使用“填充”变体选项，因为它是唯一一个运行良好的选项，但我想知道这里的裂缝是什么。

我喜欢 TextField 与 yup 一起显示错误的方式，以及它如何在下拉列表中提供建议，所以我想保留它。但是我需要以清晰的方式显示标签，而不仅仅是写一个 div NAME div 或类似的东西。

谢谢

我将 Formik 与 Yup 和 Material-UI 一起使用。我有一个包含 Material-UI 自动完成组件的表单我想在提交表单时从自动完成组件中检索用户设置的值。

目前，使用 Autocomplete 组件设置的值似乎没有传播到底层 TextField 组件。当使用自动完成选择一个值并提交表单时，表单上的处理字段上的值为空。

父 (App.js) 组件：

治疗组件：

我尝试将 a 添加valueRef到 Treatments 组件并使用onInputChangeAutocomplete 组件上的 prop 设置它，然后将该值分配给inputRefTextField 组件。但这什么也没做，也没有返回错误。