如何在Formik中使用输入清理？

文章/答案/技术大牛

发布

1回答

reactjs、formik、formik-material-ui

我正在使用Formik在我的表单中使用useFormik。在配置中，我设置了validate、onSubmit和initialValues键。我想清理我的输入，比如修剪和转义。对于电子邮件，我也想使用validator.js的normalizeEmail。我找不到将清理代码放在哪里-我是将其放在formik配置中还是放在验证函数中。我知道我可以在formik中使用

浏览 24提问于2021-07-26得票数 0

回答已采纳

1回答

如何在TextInput中获取和存储onSubmit函数的所有输入值？

reactjs、react-native、textinput、react-state

</SafeAreaView> )}因此，当用户单击该按钮(“单击ME”按钮)时，我将所有输入数据存储到一个数组

浏览 5提问于2022-10-10得票数 0

2回答

我有一个使用const [mode, setMode] = useState(false)创建的react变量，还有一个useFormik实例const formik=useFormik(initialValues但是，问题是我不能在条件中使用useFormik (我的集成开发环境会给出一个错误)，我也不能在像useEffect这样的东西中使用useFormik (集成开发环境说不能在不是react组件的回调中使用钩子

浏览 0提问于2021-05-17得票数 1

3回答

如何在Yup/Formik中验证无线输入？

formik、yup

我正在使用Yup来验证我的Formik表单，但是我不知道如何在Yup/Formik中验证单选输入。

浏览 2提问于2019-11-04得票数 9

4回答

如何使用React.createRef()流？

reactjs、flowtype

因为React 16.3，所以可以使用来访问DOM元素。我也在我的项目中使用，但是。

浏览 1提问于2018-04-28得票数 23

回答已采纳

1回答

映射Formik文本字段

javascript、reactjs、typescript、material-ui、formik

我正在使用资料ui文本字段并使用Formik验证它们。我不需要多次输入所有内容，我想要映射项目，但我无法这样做。return ( <Formik onSubmit={(values, actions> ); 目前，在注释掉部分中，我在change.bind上得到了错误，即(p

浏览 4提问于2020-03-28得票数 0

回答已采纳

1回答

Formik -句柄文件黑客-为什么组件重新呈现时，文件被选中？

reactjs、file-upload、formik

我很清楚formik不支持文件上传。我读到外面有黑客。我已经用onChange，setFieldValue和event.current.target试过了下面这个。import React from 'react'; fileTestArt = () => { debu

浏览 6提问于2020-01-08得票数 0

回答已采纳

1回答

如何禁用与Formik集成的梅花提交按钮？

reactjs、material-ui、formik、formik-material-ui

我正在尝试将Formik与Mui集成，以便有一个按钮组件，如下所示：import { Button } from "@mui/material";}; }; 这是我使用上面的代码片段，但我想知道如何在这两种情况下禁用submi

浏览 2提问于2022-04-19得票数 0

1回答

Formik handleChange -使用钩子

react-native、formik

安装Formik之前，我的输入如下所示： ....我将输入的每个字符设置为一个名为search的状态支柱。使用我输入的每一个键，调用一个API就可以从数据库中获取一些数据。如果我在输入中输入h，则db将返回2个cars honda, hyundai。我读到Formik可

浏览 2提问于2020-05-29得票数 2

2回答

当与MUI TextField之类的组件一起使用时，React表单减少重发器吗？

reactjs、react-hook-form

如上图所示，反应钩形式大大减少了重发器，并且比formik表现得好得多。但是，当与诸如material这样的UI库中的受控组件一起使用时，它还会减少每次输入更改(如Formik )上的重发器或重命名器吗？

浏览 2提问于2020-08-05得票数 0

回答已采纳

1回答

为什么没有用NextJS从表单中提交动态值？

javascript、reactjs、next.js、formik、chakra-ui

如果在表单字段中手动输入值并提交表单，则可以获得组件函数中的所有值。import { Field, Form, Formik } from "formik"; importexport default fu

浏览 4提问于2022-02-24得票数 2

回答已采纳

2回答

cypress类型输入文本测试失败的材料-ui/ formik (反应应用程序)

reactjs、material-ui、cypress、formik

登录表单是由资料-ui和formik构建的。当我运行测试时，我无法在输入中获得“数据-验证”道具。

浏览 0提问于2019-08-25得票数 0

回答已采纳

1回答

Formik字段包装器

reactjs、formik

我有一个Formik表单，我试图在其中呈现一个Formik字段。但是，该字段是一个货币域，并且触发了onBlur。我想要清理字段格式。我正在尝试将Formik字段包装在一个TextField中。onBlur={ formatInputToMoney } ) export default MoneyField 以上方法有效，当用户更改输入时，表单中的值将更新。但是，如果我没有在其中调用表单以直接更新其

浏览 4提问于2019-06-11得票数 1

1回答

React formik和yup

reactjs、validation、formik、yup

我尝试使用formik和yup进行表单验证，但我遇到了一个问题。我的验证工作正常，但如果我输入一个字段，所有字段都显示验证如何限制它。如果我输入名称字段，并给出一些输入，它将显示所有下面的字段还显示“验证错误”。我想像onBlur一样使用它，我们如何在formik中使用它？} />

浏览 11提问于2020-03-05得票数 0

回答已采纳

1回答

在输入中同时显示错误

javascript、reactjs、forms、formik、yup

我一直在使用Yup和Formik在React中进行表单验证。现在，当用户模糊输入时，就会显示错误。下面是我的代码：import { Formik, Field } from "formik"; first_name: yup.string()

浏览 1提问于2020-05-20得票数 0

1回答

从formik内部的组件中设置formik值。

javascript、reactjs、formik、formik-material-ui

我正在使用formik，我有一个输入，可以从一个自动完成器和一个位于formik内部的组件中编辑。它是这样的： initialValues={endUserLocationEdit} &#x

浏览 3提问于2021-02-03得票数 2

1回答

对Material-UI TextField使用YUP

material-ui、rect、formik、yup

我正在尝试将表单转换为使用Material-ui TextField。我如何让我的YUP验证与此一起工作？TextField from '@material-ui/core/TextField';import { Formik, Form, Field, ErrorMessage } from "formik"; import * as Yup f

浏览 6提问于2019-07-12得票数 3

1回答

React & Formik，在组件之间传递数据

javascript、reactjs、react-native、react-hooks、formik

目前，我有两个组件-一个有输入和提交按钮(输入数据)-创建的formik，第二个简单的组件，我想显示这些数据。我不知道如何在这些组件之间传递数据，我正在寻找关于如何正确地进行数据传递的技巧。这是我的代码：import React from "react";import { View, Button, TextInput } from

浏览 0提问于2021-09-13得票数 1

回答已采纳

1回答

如何在onChange事件期间访问Formik窗体中的input.value

javascript、reactjs、formik

我目前正在使用Formik库在React JS中制作一个表单。我遇到了一个验证问题，我需要用空字符串更改无效的字母。str.replace(/\D/, '); 但是我不能访问Formik值中的input。我需要在每次按键时验证值，但Formik文档中没有关于它的信息。Form import React, {useEffect} from 'react'; import { useHistory } from '

浏览 15提问于2021-08-31得票数 0

1回答