如何在useReducer中使用带必填字段的泛型类型？

type FormData = {
  requiredField: string;
  optionalField?: string;
};

type Action = { type: 'UPDATE_FIELD'; payload: Partial<FormData> };

const formReducer = (state: FormData, action: Action): FormData => {
  switch (action.type) {
    case 'UPDATE_FIELD':
      return { ...state, ...action.payload };
    default:
      return state;
  }
};

import React, { useReducer } from 'react';

const FormComponent: React.FC = () => {
  const [formData, dispatch] = useReducer(formReducer, {
    requiredField: '',
    optionalField: '',
  });

  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
    const { name, value } = e.target;
    dispatch({ type: 'UPDATE_FIELD', payload: { [name]: value } });
  };

  return (
    <form>
      <input
        type="text"
        name="requiredField"
        value={formData.requiredField}
        onChange={handleInputChange}
      />
      <input
        type="text"
        name="optionalField"
        value={formData.optionalField}
        onChange={handleInputChange}
      />
    </form>
  );
};