reactjs相关内容

在Formik中设置单选按钮组的初始值

我使用的是名为Formik(2.1.5)的最新版本的Reaction表单库。 它相当不错,但我在初始加载时遇到了单选按钮组的问题。 当我第一次加载表单时,我设置了一组初始值。 当我执行console.log并且所有数据都在那里时,我可以看到它们。 我的输入域和文本域完美地加载了初始值。 但是我的单选按钮组没有显示应该选择哪个单选按钮。 以下是我的单选按钮组代码: ..
发布时间:2022-09-25 11:35:54 其他开发

Redux在Reaction中添加了另一个Aray内的对象数组

我这里的产品可能有一个或多个图像。具体取决于ProductCode。 如果ProductCode为,则它们属于同一产品。可以在图像的文件名上找到ProductCode,它在第一个下划线之后。例如,如果文件名为AA_BB_CC.jpg。ProductCode为bb。 您可以查看“我的代码”框中的样本图像。 因此,如果图像具有相同的ProductCode,它应该加起来就是产品。我的问题是在 ..
发布时间:2022-09-25 11:08:59 其他开发

两种情况在什么时候在YUP中反应

我想提出两个条件:如果isProduct或isBox为真,则product_id应该是必需的。我在下面执行了此代码,但它不起作用 product_id: yup.string().when(['isProduct', 'isBox'], { is: true, then: yup.string().required('Select product'), }), 推荐 ..
发布时间:2022-09-25 11:01:52 其他开发

Formik验证正在提交/isValiating未设置为True

我有一个我的用户请求的表单,我清楚地表明该表单是无效的。因此,我计划弹出一个sweetalert对话框,让他们知道他们需要再次检查表单。我想我可以在验证中这样做,以便在提交尝试失败时向他们发出警报: const validate = values => { console.log(formik.isSubmitting); // always prints false con ..
发布时间:2022-09-25 10:43:49 前端开发

基于另一个字段值的必填字段-Formik,Yup

我有一个反应表格, 在有选择字段的地方, 假设该字段具有值A、B、C、D、E、F。 现在假设,另一个字段ChooseSubType只有在我选择B或D时才会显示,并且此字段仅在显示时是必填字段,而不是在此之前。 现在,我如何才能做到这一点? 以下是第一个字段的代码,即选择字段 chooseAlphabet: Yup.string().required('field requi ..
发布时间:2022-09-25 10:26:34 其他开发

如何防止Enter键触发提交

我正在使用Formik用于React应用中的一个小表单。 方法handleSubmit在用户按Enter键时触发。 有什么方法可以防止这种触发吗? 我在以前的文档中没有找到任何东西... 谢谢。 推荐答案 您可以按如下方式添加onKeyDown处理程序: /** * Stop enter submitting the form. * @param keyEv ..
发布时间:2022-09-25 10:12:28 其他开发

使用Formik的Reaction验证最大范围

我正在尝试使用Reaction和Formik进行验证。我希望实现最大位数仅为2,最大范围仅为12。 expiryMonth: yup.string().required('Select month').max(2, 'Invalid month format (Example: 06)'), 推荐答案 您可以使用此命令: yup.string() .required("S ..
发布时间:2022-09-25 10:02:02 前端开发

材质用户界面切换按钮-选中时不能更改背景颜色

我正在尝试使用材料UI切换按钮,有点像单选按钮,为用户提供对给定问题的两个选择。 它基本上可以正常工作,但当尝试调整每个切换按钮被选中时的样式时,我无法更改切换按钮的背景颜色。我在ToggleButton组件上使用了CLASS属性,并在该属性中使用了";SELECTED&QOOT;规则。 某些css属性(如pding&;boxShadow)可以正常工作,但其他属性(包括背景颜色)则 ..
发布时间:2022-09-25 09:55:28 其他开发

使用Formik和YUP的Reaction-Date Picker:未在第一个模糊时验证日期值,而不是.Required()

我在一个用Yup验证的Formik表单中使用了Reaction-Datepicker。为了将Reaction-Datepicker集成到Formik中,我使用了wrapper solution in this thread。 最初输入值时,将检查.required(),但不会检查其他任何验证。因此,我不会立即获得StartDate later than today验证。如果我再次进入该控件并 ..
发布时间:2022-09-25 09:47:37 其他开发

YUP/Formik带去反跳的异步验证

如何将取消退回应用于下面的异步验证(code from Yup's github)? let asyncJimmySchema = string().test( 'is-jimmy', '${path} is not Jimmy', async (value) => (await fetch('/is-jimmy/' + value)).responseText === 'tru ..
发布时间:2022-09-25 09:38:15 其他开发

使用YUP检查字符串或数字长度的验证

是否有用于验证特定长度的yup函数? 我尝试了.min(5)和.max(5),但我想要确保数字正好是5个字符(即邮政编码)的内容。 推荐答案 我不认为有任何内置的东西,但它很容易用test实现: yup.string() .test('len', 'Must be exactly 5 characters', val => val.length === 5) htt ..
发布时间:2022-09-25 09:05:29 前端开发

如何在Formik中禁用提交时的自动重置表单?

我有一个由formik控制的表单,当我填写所有字段并按下提交按钮时,函数onSubmit被调用,并且我的表单将重置此值。 有时我的数据不正确(如重复的电子邮件),我需要保存此数据。 如何执行此操作? 这是我的代码: const schema = Yup.object().shape({ login: Yup.string() ..
发布时间:2022-09-24 23:56:00 其他开发

如何在YUP异步验证中设置动态错误消息?

我正在尝试使用Yup的.test()方法在Formik中进行异步验证,并且需要设置从API获得的错误消息。根据后端的某些情况,错误消息会有所不同。 尝试了这里提到的几种解决方案 https://github.com/jquense/yup/issues/222和Dynamic Validation Messages Using Yup and Typescript 但Yup正在抛出t ..
发布时间:2022-09-24 23:46:43 其他开发