为什么Formik‘Touched`属性没有被填充？
Formik是一个用于处理表单的React库。它提供了一种简化和优化表单处理的方式。在Formik中，touched属性用于跟踪表单字段是否被触摸过（即用户是否与该字段进行了交互）。当用户与表单字段进行交互时，Formik会将相应字段的touched属性设置为true。
如果在使用Formik时，touched属性没有被填充，可能有以下几个原因：
- 表单字段没有正确绑定到Formik组件：确保你的表单字段正确地与Formik组件进行绑定。你可以使用Formik提供的
<Field>组件或<input>元素的name属性来绑定字段。 - 表单字段没有正确设置
onBlur事件处理程序：touched属性是在用户与表单字段进行交互并且失去焦点时设置的。确保你的表单字段正确设置了onBlur事件处理程序，并且该处理程序与Formik的handleBlur函数进行了关联。 - 表单字段的
name属性值不正确：确保你的表单字段的name属性值与Formik中的字段名称匹配。name属性值用于在Formik中标识和跟踪表单字段。
如果你已经确认了上述问题，并且仍然无法填充touched属性，可以考虑以下解决方法：
- 检查Formik的版本：确保你正在使用最新版本的Formik库。有时，旧版本可能存在一些已知的问题或错误。
- 检查Formik的文档和示例：仔细阅读Formik的官方文档和示例，以确保你正确地使用了
touched属性。文档和示例通常提供了关于Formik的最佳实践和常见问题的解答。 - 提交问题到Formik的GitHub仓库：如果你仍然无法解决问题，可以考虑在Formik的GitHub仓库中提交一个问题。开发者社区可能会提供更多的帮助和解决方案。
腾讯云相关产品和产品介绍链接地址：
- 腾讯云官网：https://cloud.tencent.com/
- 云服务器（CVM）：https://cloud.tencent.com/product/cvm
- 云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
- 人工智能平台（AI Lab）：https://cloud.tencent.com/product/ailab
- 云存储（COS）：https://cloud.tencent.com/product/cos
- 腾讯云区块链服务（BCS）：https://cloud.tencent.com/product/bcs
- 腾讯云元宇宙解决方案：https://cloud.tencent.com/solution/metaverse
相关·内容
2回答
为什么Formik‘Touched`属性没有被填充？
reactjs、react-bootstrap、formik
我正在用React、Formik、react-bootstrap和yup制作一个用于验证的表单。我正在尝试显示验证错误，但touched属性中没有填充字段。{} } = props; <Formik, errors }) => console.log('<em
浏览 35提问于2019-08-07得票数 13
回答已采纳
1回答
even使用Formik标记官方教程中的所有错误字段(甚至未触及)的引导示例
reactjs、react-bootstrap、formik
在引导-反应教程中，我阅读了关于表单验证的部分，其中他们将Formik连接起来演示他们的表单验证：。但是如果你在他们的演示中注意到，如果你只是触摸一个所需的字段(例如：(“状态”)并开始键入，all --表单字段立即被标记为错误，甚至是您没有接触的错误。他们的FirstName/lastName使用了不同的策略：isValid={touched.lastName && !errors.lastName}。但是它停止了工作，而且现在根本没有标记所需的错误。().required(),
完整的代码在页
浏览 2提问于2021-03-17得票数 1
1回答
TypeError:架构[同步？'validateSync‘：'validate']不是函数
javascript、reactjs、typescript、formik、yup
如果我编写validation = schema，它不会给出错误，但也没有验证。如果我把它改成{schema}，应用程序就会崩溃。normal" name="email"
浏览 29提问于2020-04-07得票数 1
回答已采纳
1回答
如何在MuiPhoneNumber中获取电话号码而不是国家代码
reactjs、material-ui
<MuiPhoneNumber defaultCountry={"de"} onChange={formik.handleChange}
error={formik.touched.phone && Boolean(formik.errors.phon
浏览 16提问于2022-03-09得票数 0
回答已采纳
1回答
什么是正确的方式来收集输入数据，而不滞后于输入的反应？
javascript、reactjs、react-hooks、formik、formik-material-ui
为什么会发生这种事？我的意思是反应是流行的，因为快速用户界面，对吗？那么，我们应该做些什么来处理表单而没有这个性能问题呢？ <TextField onBlur={formik.handleBlur} /
浏览 16提问于2022-06-21得票数 0
1回答
如何将现有数据从我的存储区传递到formik？
reactjs、formik
) => { }, onBlur={formik.handleBlur} error={for
浏览 26提问于2020-03-17得票数 1
1回答
如何在Formik中正确使用formik ErrorMessage，使用渲染属性和设计库输入？
javascript、reactjs、formik
我想要触发formik错误，并在输入被单击并且值不正确时被触摸。我将formik属性传递给input组件，如下所示： const initialValues = {};
);
浏览 15提问于2020-08-27得票数 0
回答已采纳
5回答
如何从formik表单中删除DOM中的空错误div？
reactjs、formik
我在身份验证页面中有以下代码来控制警报消息： {formik.errors.email && <ErrorMessage name="email" /> }
{formik.errors.password &
浏览 2提问于2020-04-28得票数 3
回答已采纳
1回答
Yup和Formik的复选框验证不起作用
javascript、validation、material-ui、formik、yup
我不确定，为什么验证不起作用： const label = { inputProps: { "aria-label": "termsOfService} formik.touched.termsOfService && }
va
浏览 5提问于2022-08-23得票数 0
1回答
对Material-UI TextField使用YUP
material-ui、rect、formik、yup
TextField from '@material-ui/core/TextField';import { Formik, Form, Field, ErrorMessage } from "formik";import axios from "axios";<&
浏览 6提问于2019-07-12得票数 3
2回答
useFormik，handlesubmit不能与验证模式一起使用
javascript、reactjs、forms、submit、formik
我尝试使用formik创建一个表单注册表，是的用于处理错误输入，但是当我尝试提交我的表单时，什么也没有发生。我不知道为什么，你知道吗？helperText={formik.touched.email && formik.errors.email}helperText={formik.touched.username && formik.errors.username}helperText={fo
浏览 25提问于2021-10-12得票数 1
回答已采纳
1回答
Formik ErrorMessage第一次没有显示
reactjs、typescript、forms、formik
我在反应项目中使用Formik表单。我在<Formik><Form>中有以下代码 <input {...fieldProps.field
浏览 2提问于2022-08-17得票数 1
回答已采纳
5回答
React formik表单验证:如何首先禁用submit按钮
reactjs、validation、formik、yup
下面是我使用React的formik表单验证代码。默认情况下，在加载表单时，我希望禁用submit按钮：import * as Yup from "yup";
但只有当我试着提交表格时，它才能起作用。因此，如果我将表单保留为空白并单击submit，则会显示所有验证错误，然后禁用该按钮。但是，它应该从一开始就被禁用。我检查了，但没有看到任
浏览 6提问于2019-12-22得票数 51
回答已采纳
1回答
如果用户选择新文件，其他明智的图像url在nodejs中没有更新，我如何更新图像url？
node.js、reactjs、mongodb、cloudinary
我正在创建一个图书项目，我将图书映像保存到cloudinary中，在那里，url保存到mongodb数据库中，这是我在更新一本书的过程中遇到的问题，当我更新我的书时，书的url没有更新，给我带来错误的控制台不能读取未定义的属性} error={formik.touched.title && Boolean(formik.errors.title}
浏览 1提问于2022-03-21得票数 -1
回答已采纳
1回答
react如何根据Formik / Yup验证向输入字段添加react图标？
reactjs、forms、material-ui、formik、yup
我是新的反应，我试图让特定的图标显示在输入字段的末尾，这取决于Formik / Yup验证。因此，如果我的验证失败了，我希望在字段的末尾显示一个红十字会图标，如果验证成功，则需要一个滴答图标。这是我当前的登录表单组件：import React from "react";import * asYup from "yup";
const LoginForm = () =>
浏览 1提问于2021-02-12得票数 1
回答已采纳
1回答
Formik:防止在提交时触摸字段(不要标记为.touched)
reactjs、formik
当我提交时，我需要阻止Formik将我的字段标记为.touched。当我触摸一个字段时，应该设置.touched，但是单击Submit可以将.touched重置为{}。我在文档里读到我正在考虑在某个地方调用setTouched({})，但我需要一个事件来告诉我验证已经完成。，而且实现起来也很混乱，
useE
浏览 0提问于2021-09-30得票数 1
1回答
如何使用formik和yup在react-native中进行验证？
validation、react-native、formik、yup
如何使用formik和yup在这里显示错误消息？假设我想显示一条关于客户名称的错误消息。该怎么做呢？Router, Scene, Actions } from 'react-native-router-flux'; import { Formik} from 'formik';
import eyeImg from '..我想在setfieldtouch、onblur和表单提交期间显示错误消
浏览 15提问于2019-05-22得票数 0
1回答
TypeError:无法读取未定义的属性“setFieldValue”。Formik不认识setFieldValue
reactjs、formik、formik-material-ui
知道它为什么没有定义吗？我以为是跟福米克一起来的。import { Formik } from 'formik';
<Formik handleChange, setFieldValue,
浏览 3提问于2021-08-31得票数 3
回答已采纳
1回答
react formik -在http请求后用数据填充表单输入
forms、reactjs、formik
我用formik创建了表单。我想用表单编辑记录。我想从数据库中获取数据，并用它们填充表单。然而，没有成功。 }); }
return ( render={({ setFie
浏览 0提问于2018-04-22得票数 6
1回答
如何在提交表单时测试useFormik
reactjs、typescript、formik、react-testing-library、ts-jest
} error={formik.touched.username && Boolean(formik.errors.username)} />}
浏览 32提问于2021-09-26得票数 1
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
即时通信 IM
ICP备案
对象存储
实时音视频活动推荐
腾讯云开发者
