设置表单元素初始值，通过props接收

import React, { useState } from 'react';
import ChildComponent from './ChildComponent';

const ParentComponent = () => {
  const [formData, setFormData] = useState({
    name: '',
    email: '',
    age: '',
  });

  const handleFormSubmit = (e) => {
    e.preventDefault();
    // 处理表单提交逻辑
  };

  return (
    <form onSubmit={handleFormSubmit}>
      <ChildComponent formData={formData} />
      <button type="submit">提交</button>
    </form>
  );
};

export default ParentComponent;

import React from 'react';

const ChildComponent = ({ formData }) => {
  return (
    <div>
      <label>
        姓名：
        <input type="text" name="name" value={formData.name} />
      </label>
      <label>
        邮箱：
        <input type="email" name="email" value={formData.email} />
      </label>
      <label>
        年龄：
        <input type="number" name="age" value={formData.age} />
      </label>
    </div>
  );
};

export default ChildComponent;