如何解决Formik,函数语句要求函数名称错误
我在应用程序中使用Formik创建了一个仅包含一个输入的简单表单,该表单按预期工作,但每次提交表单时都会出现错误,提示说
Unhandled Runtime Error
SyntaxError: Function statements require a function name
这也在控制台中
Warning: Extra attributes from the server: onsubmit,onreset
每次都将结果记录到控制台,但错误也随结果一起出现
这是我的表格
const validationSchema = yup.object({
title: yup.string().required().min(2),});
const onSubmit = async (
data: Value,{ setSubmitting,resetForm }: FormikHelpers<Value>
) => {
try {
console.log(data);
setSubmitting(false);
resetForm({});
} catch (error) {
alert(error.message);
}
};
<Formik
1 initialValues={{ title: "" }}
2 validationSchema={validationSchema}
~ 3 onSubmit={onSubmit}
4 >
~ 5 {({ errors,isSubmitting }) => (
~ 6 <Form is={"Flex"}>
~ 7 <Flex
~ 8 flexDir={"column"}
~ 9 alignItems={"center"}
~_ 10 justifyContent={"center"}
11 >
~ 12 {errors && <h1>{JSON.stringify(errors)}</h1>}
~ 13
~ 14 <Field
~ 15 as={Input}
+ 16 name="title"
+ 17 type="input"
+ 18 padding={6}
+ 19 margin={8}
+ 20 borderRadius={"sm"}
+ 21 size={"lg"}
+ 22 placeholder={"Album Title"}
+ 23 />
+ 24 <Button
+ 25 padding={6}
+ 26 border={0}
borderRadius={"sm"}
+ 23 color={"white"}
+ 22 backgroundColor={"blue.500"}
+ 21 _hover={{ backgroundColor: "blue.400" }}
+ 20 width={"100%"}
+ 19 type="submit"
isDisabled={isSubmitting}
+ 18 >
+ 17 Create new Album
+ 16 </Button>
+ 15 </Flex>
+ 14 </Form>
+ 13 )}
我做错什么了吗?
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。