如何在React.js中手动关闭react-bootstrap "DropdownButton“

import React, { useState } from 'react';
import { DropdownButton, Dropdown } from 'react-bootstrap';

const MyComponent = () => {
  const [isOpen, setIsOpen] = useState(false);

  const handleToggleDropdown = () => {
    setIsOpen(!isOpen);
  };

  const handleCloseDropdown = () => {
    setIsOpen(false);
  };

  return (
    <div>
      <DropdownButton
        title="Dropdown"
        show={isOpen}
        onClick={handleToggleDropdown}
      >
        <Dropdown.Item onClick={handleCloseDropdown}>Option 1</Dropdown.Item>
        <Dropdown.Item onClick={handleCloseDropdown}>Option 2</Dropdown.Item>
        <Dropdown.Item onClick={handleCloseDropdown}>Option 3</Dropdown.Item>
      </DropdownButton>
    </div>
  );
};

export default MyComponent;