如何仅在promise处于活动状态时显示和隐藏弹出窗口？反应

// 显示弹出窗口
function showPopup() {
  // 添加遮罩层
  const overlay = document.createElement('div');
  overlay.classList.add('overlay');
  document.body.appendChild(overlay);

  // 添加加载动画
  const loader = document.createElement('div');
  loader.classList.add('loader');
  document.body.appendChild(loader);
}

// 隐藏弹出窗口
function hidePopup() {
  // 移除遮罩层和加载动画
  const overlay = document.querySelector('.overlay');
  const loader = document.querySelector('.loader');
  document.body.removeChild(overlay);
  document.body.removeChild(loader);
}

// 执行异步操作
function performAsyncOperation() {
  // 显示弹出窗口
  showPopup();

  // 创建Promise对象
  const promise = new Promise((resolve, reject) => {
    // 执行异步任务
    setTimeout(() => {
      // 模拟异步操作成功
      const success = true;
      if (success) {
        resolve('操作成功');
      } else {
        reject('操作失败');
      }
    }, 2000);
  });

  // 处理Promise结果
  promise
    .then((result) => {
      // 隐藏弹出窗口
      hidePopup();

      // 显示成功提示框
      alert(result);
    })
    .catch((error) => {
      // 隐藏弹出窗口
      hidePopup();

      // 显示错误提示框
      alert(error);
    });
}

// 调用函数执行异步操作
performAsyncOperation();