问题标签 [formik-material-ui]

Dialog目前，我有不同形式的父组件和子组件formik，简要结构是这样的

由于某些原因我无法Dialog从 parent 中取出formik，问题是当我点击孩子的提交按钮时，父母的formik表单也会被触发，我该如何避免这种情况？

我有一个使用它的 formik 助手我在表单上管理我的状态我的问题是如何在 onChange 方法上更改组件状态我尝试了类似下面的方法但它没有成功！任何人都可以帮助我.. 每当用户触发 onChange 方法时，我想获取它的值并通过该值请求 api 并在表单上添加新的选择...非常感谢

我有一个 JSON 对象，其中包含一组 JSON 对象。我的需要是 2 个数组元素（车辆），我只需要确保至少一个充满数据，即两者都不能为空。请参阅下面的声明和我的 Yum 架构

我上面的车辆验证有效，尽管它强制用户填写车辆下两个数组项的registrationNumber元素，这不是我想要的。任何帮助将非常感激。我也在下面尝试过，但它不起作用......

我在验证时收到以下错误...

好的，在使用下面 Luis 的解决方案后，它似乎验证了注册号，尽管我现在得到了多个错误文本。我正在使用 Formik 和 Yup .. Formik 代码如下...

请参阅下面的多个错误..错误文本“至少需要一个注册号”重复两次

嗨 Luis，更新的解决方案不起作用，这可能是因为我在表单中同时使用了 Formik-material-ui 和 material-ui..见下文..为了区分两个 TextField 元素，我使用了别名muiTextField 在这里

以下是我更新的代码...

formik-material-ui 只是常见 material-ui 元素的包装。我很好奇为什么您在 getVehicleErrors() 函数中有“电子邮件”引用。那是错字吗？在我更新我的代码（如上所述）后，这里的 muiTextField 指的是 material-ui 的 TextField，现在我在我的表单上看不到车辆登记字段..见下文

设法通过以下更改解决了问题....

我正在使用 Material-UI Accordion，在里面AccordionSummary我有一个<TextField />（实际上由 Formik 和 formik-material-ui 控制），并且AccordionSummary仅在字段内单击时背景变为灰色。我不希望它这样做，而且它似乎不是 Accordion API 配置的任何东西，除非我遗漏了一些东西。我怎样才能阻止它这样做呢？

我在Codesandbox上重新创建了这个问题。

以下是沙盒中的完整代码：

我正在尝试使用类似于单选按钮的 Material UI Toggle Button 来为用户提供给定问题的 2 个选择。

它主要按预期运行，但是当尝试调整选择每个切换按钮时的样式时，我无法更改切换按钮的背景颜色。我在 ToggleButton 组件上使用 classes 道具，并在该道具中使用“选定”规则。某些 css 属性（例如 padding 和 boxShadow）有效，但其他属性（包括 backgroundColor）则无效。我的目标是让 Toggle 按钮在选择时具有蓝色背景，但到目前为止，我无法让它在选择时显示与深灰色背景不同的显示。

我正在使用 React，以及 Formik 和 Formik-Material-UI。这是我的代码：

是否可以有一个表单，其值会随着组件道具的变化而变化？

我有一个带有两个子组件的父组件，随着子组件 1 的某些变化，我希望它向其兄弟组件发送更新并更新表单值。我将 formik 与 React 和 material-ui 一起使用。我能够将数据发送到同级组件，但我在管理表单状态时遇到了问题。我将表单的初始值设置为 props.data['fieldName'] 并且该部分正在工作。

但是 material-ui 文本字段没有设置为脏，所以标签就在值的顶部。

当我尝试更新值时，它不允许我更改它。

我对 React 相当陌生，这似乎我只是不太明白应该如何在 React 中完成，任何帮助将不胜感激。

I want to do the validation of form in my react application with Formik. I have the fields firstName, lastname, email, phone, address, hobbies. for firstName & lastName (both are required fields) intial values are

for rest of the fields (optional fields), initial values are

Note:- isPublic is a flag for the toggle button to show the field information to other users. So after filling the phone number, address, hobbies, the value should be like this

How can we get this formik value on click of submit button to send these data to API.

我正在使用 formik-material-ui 包的 Field 组件和 component={Autocomplete} 道具，我试图将值设置为对象中的字符串。我不想改变 options={data} 属性的形状，而是获取字符串值而不是整个对象。但是，字段本身的值被抽象为名称 prop，我对如何操作它感到困惑。还有一点需要注意的是，我还希望设置 freeSolo 属性，以便用户可以使用或不使用自动完成的数据。

这是带有自动完成选项的当前示例响应。

这是不是自动完成选项的当前示例响应

这是我想要的字符串响应。

或者

我为任何愿意帮助的人制作了一个 Codesandbox https://codesandbox.io/s/elegant-lichterman-9dfq7?file=/src/index.tsx

非常感谢任何帮助或想法！

我创建了一个显示 3 个formik字段的代码框：名字、姓氏和姓名。

我试图使该字段仅在用户自己修改该字段之前name显示，因此条件失败，此后该字段不应再自动更新。${firstName} ${lastName}namename === firstName + ' ' + lastNamename

挑战在于我试图让这段代码存在于MyContactForm.tsx文件中，因为此后我需要在其他类似My*Form.tsx组件中重用字段间依赖的逻辑，因此MyForm.tsx无需更改即可重用“通用”组件。

我想知道是否有一种方法可以访问 MyComponent 中的 theme.customElements.acitonButton 而不必使用 makeStyles？例如，我可以以某种方式输入 className={theme.customElements.actionButton} 吗？

主题.js

我的组件.tsx