useFormik()

useFormik() 是一个自定义的 React hook，它将直接返回所有 Formik 状态和帮助器。尽管它的名字如此，但它并不适用于大多数用例。在内部，Formik 使用 useFormik 创建 <Formik> 组件（它渲染一个 React Context 提供程序）。如果您尝试通过上下文访问 Formik 状态，请使用 useFormikContext。仅当您**不**使用 <Formik> 或 withFormik 时，才使用此 hook。

**请注意，<Field>、<FastField>、<ErrorMessage>、connect() 和 <FieldArray> 将**无法**与 useFormik() 一起使用，因为它们都需要 React Context。

`useFormik()` 的用例

您是 Jared
您正在修改返回值并创建 <Formik> 的修改版本以供您自己使用
您希望避免使用 React Context（可能是出于性能原因）

示例

1 import React from 'react';
2 import { useFormik } from 'formik';
3 
4 const SignupForm = () => {
5   const formik = useFormik({
6     initialValues: {
7       firstName: '',
8       lastName: '',
9       email: '',
10     },
11     onSubmit: values => {
12       alert(JSON.stringify(values, null, 2));
13     },
14   });
15   return (
16     <form onSubmit={formik.handleSubmit}>
17       <label htmlFor="firstName">First Name</label>
18       <input
19         id="firstName"
20         name="firstName"
21         type="text"
22         onChange={formik.handleChange}
23         value={formik.values.firstName}
24       />
25       <label htmlFor="lastName">Last Name</label>
26       <input
27         id="lastName"
28         name="lastName"
29         type="text"
30         onChange={formik.handleChange}
31         value={formik.values.lastName}
32       />
33       <label htmlFor="email">Email Address</label>
34       <input
35         id="email"
36         name="email"
37         type="email"
38         onChange={formik.handleChange}
39         value={formik.values.email}
40       />
41       <button type="submit">Submit</button>
42     </form>
43   );
44 };