material-ui表清除选择

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

const MyForm = () => {
  const [selectedValue, setSelectedValue] = useState('');

  const handleChange = (event) => {
    setSelectedValue(event.target.value);
  };

  const handleClear = () => {
    setSelectedValue('');
  };

  return (
    <div>
      <FormControl fullWidth>
        <Select
          value={selectedValue}
          onChange={handleChange}
          displayEmpty
          inputProps={{ 'aria-label': 'Without label' }}
        >
          <MenuItem value="">
            <em>None</em>
          </MenuItem>
          <MenuItem value="option1">Option 1</MenuItem>
          <MenuItem value="option2">Option 2</MenuItem>
        </Select>
      </FormControl>
      <Button variant="contained" color="secondary" onClick={handleClear}>
        Clear
      </Button>
    </div>
  );
};

export default MyForm;