如何自动销毁对话框组件？就像(AutoHideDuration)

import React, { useState, useEffect } from 'react';

const Dialog = () => {
  const [isOpen, setIsOpen] = useState(true);

  useEffect(() => {
    const timer = setTimeout(() => {
      setIsOpen(false);
    }, AutoHideDuration); // AutoHideDuration为自动隐藏的时间间隔，单位为毫秒

    return () => {
      clearTimeout(timer); // 清除定时器，避免内存泄漏
    };
  }, []);

  return (
    <div>
      {isOpen && (
        // 对话框内容
      )}
    </div>
  );
};

export default Dialog;

import React, { useState } from 'react';
import Dialog from './Dialog';

const App = () => {
  const [showDialog, setShowDialog] = useState(false);

  const handleButtonClick = () => {
    setShowDialog(true);
  };

  return (
    <div>
      <button onClick={handleButtonClick}>显示对话框</button>
      {showDialog && <Dialog />}
    </div>
  );
};

export default App;