单击汉堡包菜单时，覆盖菜单不会显示X

<div class="menu">
  <button class="hamburger">☰</button>
  <div class="overlay-menu">
    <button class="close-x">X</button>
    <!-- 其他菜单项 -->
  </div>
</div>

.overlay-menu .close-x {
  display: block; /* 确保显示 */
  position: absolute;
  top: 10px;
  right: 10px;
}

document.querySelector('.close-x').addEventListener('click', function() {
  document.querySelector('.overlay-menu').style.display = 'none';
});

import React, { useState } from 'react';

function Menu() {
  const [isMenuOpen, setIsMenuOpen] = useState(false);

  return (
    <div className="menu">
      <button className="hamburger" onClick={() => setIsMenuOpen(true)}>☰</button>
      {isMenuOpen && (
        <div className="overlay-menu">
          <button className="close-x" onClick={() => setIsMenuOpen(false)}>X</button>
          {/* 其他菜单项 */}
        </div>
      )}
    </div>
  );
}