如何在React中使下拉子菜单关闭触摸设备(即i-pad)

import React, { useState } from 'react';

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

  const handleTouchStart = (event) => {
    const target = event.target;
    const isDropdownMenu = target.classList.contains('dropdown-menu');
    const isDropdownMenuParent = target.closest('.dropdown-menu');

    if (!isDropdownMenu && !isDropdownMenuParent) {
      setIsOpen(false);
    }
  };

  return (
    <div className="dropdown">
      <button onClick={() => setIsOpen(!isOpen)}>Toggle Menu</button>
      {isOpen && (
        <ul className="dropdown-menu" onTouchStart={handleTouchStart}>
          <li>Option 1</li>
          <li>Option 2</li>
          <li>Option 3</li>
        </ul>
      )}
    </div>
  );
};

export default DropdownMenu;