Material UI Select - object as value失败

import React, { useState } from 'react';
import { Select, MenuItem } from '@material-ui/core';

const options = [
  { id: 1, label: 'Option 1' },
  { id: 2, label: 'Option 2' },
  { id: 3, label: 'Option 3' },
];

const MySelect = () => {
  const [selectedOption, setSelectedOption] = useState(options[0]);

  const handleSelectChange = (event) => {
    const selectedValue = event.target.value;
    const selectedOption = options.find(option => option.id === selectedValue);
    setSelectedOption(selectedOption);
  };

  return (
    <Select value={selectedOption.id} onChange={handleSelectChange}>
      {options.map(option => (
        <MenuItem key={option.id} value={option.id}>{option.label}</MenuItem>
      ))}
    </Select>
  );
};

export default MySelect;