Reactjs 在设置之前或之后，如何在不同组件之间共享Formik初始值？

我很难理解Formik以及它是如何管理状态的。我的应用程序中有多个包含表单的组件。这些表格故意有很多重叠之处。当我在一个组件中获取值时，我希望其他组件也能访问这些值

我曾考虑对每个值使用useState或useReducer，但我读了一些书，发现Formik自己管理状态？所以我这里的问题是，仅仅访问不同组件中某个组件中“initialValues”的值

import { Formik, Field, Form, ErrorMessage } from 'formik';
import * as Yup from 'yup';

<Formik 
     initialValues={{ name: '', ... }} //how can I use these values in other components? 
                                       //how can I 'save' them so that if the user 
                                       //accesses another page with a form, 
                                       //the data that has already been provided is accessible?

     onSubmit={(values, { setSubmitting }) => {
         setTimeout(() => {
            alert(JSON.stringify(values, null, 2)); 
            setSubmitting(false);
         }, 400)
     }}
>

  <Form>
    <label htmlFor="name">Name</label>
      <Field maxLength="51"
             name="name"  
             type="text" 
      />
      <ErrorMessage name="name" />
      ...
  </Form>

</Formik>

从'Formik'导入{Formik，Field，Form，ErrorMessage}；
从“是”以是的形式导入*；
{
设置超时（（）=>{
警报（JSON.stringify（值，null，2））；
设置提交（假）；
}, 400)
}}
>
名称
...

正如道具名称所示，这些只是表单装载时表单的初始值。Formik确实存储状态，因为它跟踪输入值、触摸和错误状态，以及它们是如何控制输入元素更新的。由于Formik在后台使用上下文API，因此Formik状态仅对组件的子级可用。要访问此Formik状态（有时统称为Formik bag），可以使用渲染道具模式（）或挂钩

最终，如果您需要多个组件（例如多个不同页面的实现），您将需要在不同组件之间传输状态。在这里，我建议您不要忽略这样一个事实，即您可以在一个组件中包含多个组件，这些组件在页面上可视地分开（）。如果您真的想在不同的组件之间传输状态，可以通过多种方式来实现

从API保存和重新获取（适用于使用API时的不同页面）

保存在封装所有需要数据的表单的react上下文中-您可以在“onSubmit”中更新上下文，或者如果您使用渲染道具作为的子级，则可以在每次重新渲染时更新上下文（由任何更改引起）

如果您这样做，您也应该阅读组件上的重新初始化道具-