将多个字段值保存在状态React中

import React, { useState } from 'react';

function MyComponent() {
  // 定义状态和对应的更新函数
  const [field1, setField1] = useState('');
  const [field2, setField2] = useState('');
  const [field3, setField3] = useState('');

  // 处理字段值变化的函数
  const handleFieldChange = (event, field) => {
    switch (field) {
      case 'field1':
        setField1(event.target.value);
        break;
      case 'field2':
        setField2(event.target.value);
        break;
      case 'field3':
        setField3(event.target.value);
        break;
      default:
        break;
    }
  };

  return (
    <div>
      <input type="text" value={field1} onChange={(e) => handleFieldChange(e, 'field1')} />
      <input type="text" value={field2} onChange={(e) => handleFieldChange(e, 'field2')} />
      <input type="text" value={field3} onChange={(e) => handleFieldChange(e, 'field3')} />
    </div>
  );
}

export default MyComponent;