有没有办法将 formik 表单值从子组件传递到父组件并仅在父组件中处理表单提交。我有一个用例，我正在为餐厅构建一个表单。表单将有许多许多字段。所以我将它们分组并创建了单独的较小的表单组件。所有子组件的验证模式（是的）都写在子组件内部。

或者，如果有任何其他方法可以完成此任务，请告诉我。

class FirstChildForm extends Component {
    constructor(props) {
        super(props);
        this.state = {
            firstChildFormData: {}
        }
    }

    render() {
        return (
            <Formik
              initialValues={{ }}
              validationSchema={{ }}
              {props => {const {values} = props;
                return(
                 <div>First Form</div>
                )
              }}
            )
      }
}


class SecondChildForm extends Component {
    constructor(props) {
        super(props);
        this.state = {
            secondChildFormData: {}
        }
    }

    render() {
        return (
            <Formik
              initialValues={{ }}
              validationSchema={{ }}
              {props => {const {values} = props;
                return(
                 <div>Second Form</div>
                )
              }}
            )
      }
}



export default class App extends Component {
    constructor(props) {
        super(props);
        this.state = {
            data: {
              firstFormData : '',
              secondFormData : '',
            },
        }
    }

    handleSubmit = () => {

    }

    render() {
        return (
            <Formik
              initialValues={{ }}
              validationSchema={{ }}
              {props => {const {values, isSubmitting} = props;
                return(
                 <div className='finalform'>
                   <FirstChildForm />
                   <SecondChildForm />

                    <button onClick={this.handleSubmit}> 
                     Submit</button>
                 </div>
                )
              }}
            )
      }

}