调用async新增方法后Promise处于pending状态 无法获取模型插入的最新BOOK_KEY值

问题原因 #

你碰到的是JavaScript异步编程的典型问题，核心有两点：

• async 修饰的函数默认返回Promise对象，你直接同步赋值拿到的只是 pending 状态的Promise实例，不是异步执行完成后的返回结果
• 你原有的addBook方法没有显式返回异步操作的结果，就算执行完成也拿不到BOOK_KEY的值，且混用await和then的写法容易造成返回值层级混乱

修正方案 #

第一步：改写addBook方法

两种写法选一种即可，更推荐第一种纯async/await的写法，逻辑更清晰：

// 写法1：纯async/await（推荐）
async addBook(data) {
  const BOOK = await db.BOOK.create(data);
  console.log("BOOK_KEY", BOOK.BOOK_KEY);
  return BOOK.BOOK_KEY;
}

// 写法2：保留then链
async addBook(data) {
  // 注意这里要把整个Promise链return出去
  return await db.BOOK.create(data).then((BOOK) => {
    console.log("BOOK_KEY", BOOK.BOOK_KEY);
    return BOOK.BOOK_KEY;
  })
}

第二步：正确调用异步方法拿值

同样两种可选方案，根据你的调用场景选择：

方案1：用await获取（调用方所在函数必须也是async修饰）

// 注意外层函数必须加async修饰
async yourFunction() {
  // ...其他业务逻辑
  let bookId = await this.addBook(data);
  console.log("bookId", bookId);
  // 所有依赖bookId的后续逻辑可以写在这里
}

方案2：用then回调获取

this.addBook(data).then(bookId => {
  console.log("bookId", bookId);
  // 所有依赖bookId的后续逻辑必须写在这个回调内部
})

补充说明 #

所有依赖bookId的业务逻辑都必须放在异步回调/await后面，不能写在异步调用之外的同步位置，否则会出现异步逻辑还没执行完成、同步代码先执行拿不到值的问题。

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