如何让模式在React中自动关闭？

import React, { useState } from 'react';

function App() {
  const [isModalOpen, setIsModalOpen] = useState(false);

  // 其他组件代码...

  return (
    <div>
      {/* 模态框组件 */}
      {isModalOpen && (
        <Modal onClose={() => setIsModalOpen(false)}>
          {/* 模态框内容 */}
        </Modal>
      )}

      {/* 其他组件代码... */}
    </div>
  );
}

export default App;

function App() {
  const [isModalOpen, setIsModalOpen] = useState(false);

  // 其他组件代码...

  return (
    <div>
      {/* 模态框组件 */}
      {isModalOpen && (
        <Modal onClose={() => setIsModalOpen(false)}>
          {/* 模态框内容 */}
        </Modal>
      )}

      {/* 触发模态框显示的按钮 */}
      <button onClick={() => setIsModalOpen(true)}>打开模态框</button>

      {/* 其他组件代码... */}
    </div>
  );
}

export default App;

function Modal({ onClose }) {
  return (
    <div className="modal">
      {/* 模态框内容... */}

      {/* 关闭按钮 */}
      <button onClick={onClose}>关闭</button>
    </div>
  );
}