对象作为 React 子对象无效（找到：带有键 {} 的对象）？

Question

  **Reack_formik**

我正在尝试使用 Formik 验证我的表单字段，但我收到错误 Objects are not valid as a React child (found: object with keys {})，我看到了同样的错误问题已经被问过了，但就我而言，我无法弄清楚所以我决定在这里问。首先我想知道我的代码的错误在哪里，其次主要是我面临这个错误，对象作为 React 子级无效（找到：带有键 {} 的对象），所以这个错误的实际含义是什么。非常感谢您的帮助，我正试图从昨天开始解决，但我无法解决

---

import React from 'react'
         import {Formik,Form,Field, ErrorMessage} from "formik"
         import * as  Yup from 'yup' 
         const FormikComponent = () => {
         const initialValues= {
                name:"",
                email:"",
                password:""
            }
         const onSubmit=values=>{
                console.log("Values after submission", values)
            }
            const validationSchema=Yup.object({
                name:Yup.string().required("Requried"),
                email:Yup.string().email("inavlid email formate").required("required"),
                password:Yup.string().required("required")
            })
        return (
            <Formik initialValues={initialValues} validationSchema={validationSchema} 
                           onSubmit= {onSubmit}>
                 <Form action="">
                     <div className="form-control">
                     <label htmlFor="name">name</label>
                     <Field type="text" name="name" id="name"  />
                     <ErrorMessage name="name"/> 
                     </div>
                     <div className="form-control">
                     <label htmlFor="email">email</label>
                     <Field type="email" name="email" id="email"   />
                     <ErrorMessage email="email"/>
                     </div>
                     <div className="form-control">
                     <label htmlFor="password">Password</label>
                     <Field type="Password" name="password" id="password" />
                     <ErrorMessage password="password"/>
                     </div>
                     <button type="submit">Submit</button>
                 </Form>
            </Formik>
        )
    }
    export default FormikComponent ;

---

      **App.js**


 import './App.css';
import FormikComponent from './Formik4';
function App() {
  return (
       <div className="main">
         <h1>React form</h1>
         {<FormikComponent/>}
       </div>
  );
}
export default App;

Answer 1

由于错误组件写入错误而出现错误

<ErrorMessage email="email"/>

应该写成

<ErrorMessage name="email"/>