调用react路由器链接时，react bootstrap下拉菜单不关闭

import React, { Component } from 'react';
import { Dropdown } from 'react-bootstrap';
import { withRouter } from 'react-router';

class MyComponent extends Component {
  constructor(props) {
    super(props);
    this.dropdownRef = React.createRef();
    this.state = {
      isOpen: false
    };
  }

  componentDidMount() {
    this.props.history.listen(() => {
      if (this.state.isOpen) {
        this.dropdownRef.current.close();
        this.setState({ isOpen: false });
      }
    });
  }

  handleDropdownToggle = () => {
    this.setState(prevState => ({ isOpen: !prevState.isOpen }));
  };

  render() {
    return (
      <Dropdown show={this.state.isOpen} onToggle={this.handleDropdownToggle}>
        <Dropdown.Toggle>
          Dropdown
        </Dropdown.Toggle>
        <Dropdown.Menu ref={this.dropdownRef}>
          {/* Dropdown menu items */}
        </Dropdown.Menu>
      </Dropdown>
    );
  }
}

export default withRouter(MyComponent);