如何在Promise resolve后调用函数以替代新手使用的setTimeout写法

你当前的代码存在的核心问题是手动创建的Promise没有接入父级异步链，导致无法捕获其完成触发时机，只能靠setTimeout延迟兜底，直接按如下方式改造即可：

最小改造方案（保持原有.then写法） #

public onInit(): Promise<void> {
  return super.onInit().then(_ => {
    // 手动创建的Promise需要return，接入上层Promise链
    return new Promise<void>((resolve: () => void, reject: (error: any) => void): void => {
      this.context.aadHttpClientFactory
        .getClient(APIAppRegID)
        .then((client: AadHttpClient): void => {
          this.httpClient = client;
          resolve();
        }, err => reject(err));
    })
    // Promise执行完成后直接调用目标方法，不需要延迟
    .then(() => this.getEventData())
    // 追加异常捕获，避免异步报错无提示
    .catch(err => console.error('初始化HTTP客户端失败：', err));
  });
}

更简洁的async/await写法（推荐，可读性更高） #

你不需要手动封装Promise，aadHttpClientFactory.getClient本身就返回Promise实例，用async/await语法可以大幅简化逻辑：

public async onInit(): Promise<void> {
  await super.onInit();
  try {
    this.httpClient = await this.context.aadHttpClientFactory.getClient(APIAppRegID);
    this.getEventData();
  } catch (err) {
    console.error('初始化HTTP客户端失败：', err);
  }
}

改造说明 #

• 移除了冗余的setTimeout硬延迟逻辑，完全靠Promise回调保证执行顺序，不会出现请求还没完成就调用getEventData的问题，也不会额外浪费等待时间
• 补全了异步异常捕获逻辑，出现请求失败等问题可以直接在控制台看到报错信息，方便排查
• async/await写法去掉了不必要的手动Promise封装，代码逻辑和同步写法一致，更适合新手理解维护

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