React TypeScript:如何使用fetch获取表单值和响应代码

import React, { useState } from 'react';

const MyForm: React.FC = () => {
  const [formData, setFormData] = useState({ name: '', email: '' });

const handleSubmit = (event: React.FormEvent<HTMLFormElement>) => {
  event.preventDefault();
  
  fetch('https://api.example.com/submit', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
    },
    body: JSON.stringify(formData),
  })
    .then(response => response.json())
    .then(data => {
      // 处理响应数据
    })
    .catch(error => {
      // 处理错误
    });
};

const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {
  const { name, value } = event.target;
  setFormData(prevState => ({
    ...prevState,
    [name]: value,
  }));
};

return (
  <form onSubmit={handleSubmit}>
    <label>
      Name:
      <input type="text" name="name" value={formData.name} onChange={handleInputChange} />
    </label>
    <label>
      Email:
      <input type="email" name="email" value={formData.email} onChange={handleInputChange} />
    </label>
    <button type="submit">Submit</button>
  </form>
);