如何在请求耗时过长时显示提示消息？已尝试setTimeout未成功

你的问题核心在于：只定义了定时器逻辑，但没将其与请求的生命周期绑定——既没在发起请求时启动定时器，也没在请求完成后清除定时器，导致要么提示不触发，要么请求完成后仍弹出提示。

直接修改代码如下（假设restService.get返回Promise）：

getData(url, requestParams) {
  // 启动10秒超时提示定时器
  const timeoutTimer = setTimeout(() => {
    console.log("请求耗时已超过10秒，请继续等待...");
  }, 10000);

  // 发起请求，无论成功/失败都清除定时器
  return this.restService.get(url, requestParams)
    .finally(() => {
      clearTimeout(timeoutTimer);
    });
}

如果想保留showMessage函数，也可以这么写：

showMessage(time) {
  // 返回定时器ID，方便后续清除
  return setTimeout(() => {
    console.log("请求耗时已超过10秒，请继续等待...");
  }, time);
}

getData(url, requestParams) {
  const timeoutTimer = this.showMessage(10000);
  
  return this.restService.get(url, requestParams)
    .finally(() => {
      clearTimeout(timeoutTimer);
    });
}

关键注意点 #

• 原代码中restService.get的第一个参数写死为'url'，需要改成传入的url参数，否则请求地址错误
• 使用finally方法确保请求无论成功还是失败，都会清除定时器，避免无效提示
• 只有当请求实际耗时超过10秒时，提示才会触发；若请求在10秒内完成，定时器会被提前清除

内容的提问来源于stack exchange，提问作者Mat