传递formevent和index React类型脚本

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

const ParentComponent = () => {
  const [formData, setFormData] = useState('');
  const [listData, setListData] = useState([]);

  const handleFormSubmit = (event) => {
    event.preventDefault();
    // 处理表单提交事件
    // 可以使用formData进行相应操作，比如添加到列表
    setListData([...listData, formData]);
    setFormData('');
  };

  return (
    <div>
      <form onSubmit={handleFormSubmit}>
        <input
          type="text"
          value={formData}
          onChange={(event) => setFormData(event.target.value)}
        />
        <button type="submit">提交</button>
      </form>
      {listData.map((item, index) => (
        <ChildComponent
          key={index}
          formEvent={item}
          index={index}
        />
      ))}
    </div>
  );
};

export default ParentComponent;

// 子组件
import React from 'react';

const ChildComponent = ({ formEvent, index }) => {
  return (
    <div>
      <p>表单数据：{formEvent}</p>
      <p>索引：{index}</p>
    </div>
  );
};

export default ChildComponent;