循环调取接口提示语显示一次

循环调取接口, 只有全部提交完成后才返回成功

基本写法

submitTaskProcess() {
  const taskIdArray = this.selectTaskInfo;
  for (var i = 0; i < taskIdArray.length; i++) {
    const params = {
      taskId: taskIdArray[i]
    };
    this.submitTaskProcessLoading = true;
    stageTaskSsubmitProcess(params).then((res) => {
      if (res.success) {
        this.$message.success(res.message);
        this.submitTaskProcessLoading = false;
      } else {
        this.$message.warning(res.message);
      }
    });
  }
}

优化

如果您希望在循环调用接口时message只显示一次，并且想要优化for循环，可以采用以下几个步骤：

使用async/await处理异步调用。
使用Array.prototype.map和Promise.all来等待所有接口调用完成。
只在所有任务完成后显示一条成功或警告信息。

这里是一种优化后的实现方式：

async submitTaskProcess() {
  const taskIdArray = this.selectTaskInfo;
  this.submitTaskProcessLoading = true;

  // 创建一个所有任务的Promise数组
  const promises = taskIdArray.map(taskId => {
    const params = { taskId };
    return stageTaskSsubmitProcess(params);
  });

  // 等待所有任务完成
  try {
    const results = await Promise.all(promises);
    const allSuccess = results.every(res => res.success);

    // 根据任务的成功与否显示相应的message
    if (allSuccess) {
      this.$message.success('所有任务都已成功提交！');
    } else {
      this.$message.warning('一个或多个任务提交时遇到问题，请检查。');
    }
  } catch (error) {
    console.error('提交任务过程中出现错误:', error);
    this.$message.error('提交任务过程中出现错误。');
  } finally {
    this.submitTaskProcessLoading = false;
  }
}

在上面的代码中，我们创建了一个promises数组，其中包含了所有stageTaskSsubmitProcess函数调用的Promise。然后通过Promise.all等待所有的Promise都解决后才继续执行。

results变量将会是一个包含每个任务调用结果的数组。我们接着检查所有调用是否成功，然后显示一条统一的信息。try/catch/finally结构用于处理可能发生的任何异常情况，并在所有操作完成后关闭加载状态。

这样，不仅优化了循环的处理方式，还实现了只显示一次信息的要求。