如何在react组件的map方法中添加复选框或单选按钮？

import React, { useState } from 'react';

const MyComponent = () => {
  const [options, setOptions] = useState({
    option1: false,
    option2: false,
    option3: false
  });

  const handleCheckboxChange = (option) => {
    setOptions(prevOptions => ({
      ...prevOptions,
      [option]: !prevOptions[option]
    }));
  };

  const renderOptions = () => {
    return Object.keys(options).map(option => (
      <div key={option}>
        <input
          type="checkbox"
          checked={options[option]}
          onChange={() => handleCheckboxChange(option)}
        />
        <label>{option}</label>
      </div>
    ));
  };

  return (
    <div>
      {renderOptions()}
    </div>
  );
};

export default MyComponent;