Pinia中耗时同步函数转Promise实现异步的方法咨询

是的，完全可以通过将longFunction1和longFunction2改为返回Promise，再用.then()链式调用来实现需求，这不仅能贴合你原本的执行逻辑，还能帮你直观理解Promise的异步流程和链式调用机制。

一、改造耗时函数为Promise #

把原来的同步耗时函数包裹进Promise中，模拟异步执行（如果实际是IO类异步操作，直接返回对应Promise即可）：

longFunction1(inDat) {
  return new Promise((resolve) => {
    // 保留原有的耗时处理逻辑
    const outArray = /* 原逻辑处理inDat后的结果 */;
    // 处理完成后，通过resolve传递结果
    resolve(outArray);
    
    // 如果是真实异步操作（比如读取文件、API请求），直接返回对应的Promise即可，无需手动new Promise
    // 示例：return axios.get('/api/data', { params: inDat });
  });
}

longFunction2(inDat) {
  return new Promise((resolve) => {
    const outArray = /* 原逻辑处理inDat后的结果 */;
    resolve(outArray);
  });
}

二、用.then()链式调用改造fetchData #

通过链式调用保证longFunction2必须等待longFunction1执行完成后再运行，最后更新fetchedData：

fetchData() {
  this.longFunction1(this.array)
    // 第一个Promise完成，拿到dat1后调用longFunction2
    .then(dat1 => this.longFunction2(dat1))
    // 第二个Promise完成，更新数据
    .then(dat2 => {
      this.fetchedData = dat2;
    })
    // 统一处理两个函数可能出现的错误
    .catch(error => {
      console.error('数据处理失败:', error);
    });
}

三、可选：用async/await简化代码（基于Promise的语法糖） #

如果觉得链式调用不够直观，也可以用async/await写法，逻辑和链式调用完全一致，只是语法更简洁：

async fetchData() {
  try {
    const dat1 = await this.longFunction1(this.array);
    const dat2 = await this.longFunction2(dat1);
    this.fetchedData = dat2;
  } catch (error) {
    console.error('数据处理失败:', error);
  }
}

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