【问题标题】:Resolving an array or promises and getting the result解析数组或承诺并获得结果
【发布时间】:2020-10-06 22:36:07
【问题描述】:

我正在尝试映射和格式化数据以将其呈现到表格中。我有一系列承诺,我试图用 Promise.all() 来解决。但它似乎没有返回承诺的结果。

我的代码如下:

const formatData = (data) => {
  let dataCopy = data;

  if (dataCopy.items && _.has(dataCopy.items[0], 'tenantId')) {
      dataCopy.items = setTenants(dataCopy)
  }

  // format parameters or table render
  // other formatting for the table
  return dataCopy.items.map(item => ({
      ...item,
      created: new Date(item.created).toDateString(),
      updated: new Date(item.updated).toDateString(),
      ...(item.active && { active: item.active.toString() })
  }));
};

const setTenants = (data) => {
  const promises = data.items.map(item => {
      return getTenant(item)
  })
  return Promise.all(promises).then(res => { return res })
}

const getTenant = (row) => {
  return tenantService.getTenantById(row.tenantId).then(res => {
      // set name as the tenant param for the table
      row.tenant = res.name
      return row
  });
}

我的数据复制变量只返回:

[[PromiseState]]: "fulfilled"
[[PromiseResult]]: Array(10)

结果是“setTenants”函数的正确结果。

【问题讨论】:

    标签: javascript reactjs ecmascript-6 promise es6-promise


    【解决方案1】:

    我有一系列承诺,我正试图用Promise.all() 解决。

    Promise.all 没有解决承诺(或者我认为你的意思是在这种情况下解决¹)。它允许您观察承诺被结算的结果。它不会他们安定下来。

    您的setTenants 函数返回一个承诺。要使用其履行价值,您必须使用.thenawait(在async 函数中)。请记住,当setTenants 返回它的承诺时,已经开始的操作可能还没有完成

    所以

    setTenants(/*...*/)
    .then(results => {
        // use results...
    })
    .catch(error => {
        // handle/report error
    });
    

    或者,在 async 函数中:

    const results = await setTenants(/*...*/);
    

    (可能使用try/catch 来处理拒绝,尽管您通常希望让它传播给调用者并在那里处理它。)


    旁注:此代码中的then 回调毫无意义:

    return Promise.all(promises).then(res => { return res })
    

    应该是:

    return Promise.all(promises);
    

    ¹ 一些承诺术语:

    • fulfill - 使用特定的 fulfillment value 将 promise 状态从 pending 更改为 fulfill
    • reject - 将承诺状态从 pending 更改为 rejected 并具有特定的 rejection 原因
    • resolve - 直接(通过履行或拒绝)或间接(通过使其结果取决于另一个承诺的结果)来确定承诺的最终结果

    重要的是要认识到,如果一个已解决的 Promise 已解析为另一个 Promise 并且另一个 Promise 处于未决状态,它仍将处于未决状态。

    这是一个例子:

    const p1 = new Promise(resolve => {
        setTimeout(resolve, 800, 42);
    });
    
    // This could also be written: `const p2 = Promise.resolve(p1);`
    const p2 = new Promise(resolve => {
        resolve(p1);
    });
    
    // At this point, both `p1` and `p2` are *pending*; `p2` is *resolved to*
    // `p1`, but neither `p1` nor `p2` is *settled* yet
    
    p2
    .then(value => {
        // At this point, `p2` is *fulfilled* (one of the two kinds of *settled*)
        console.log(value);
    })
    .catch(error => {
        // At this point, `p2` is *rejected* (one of the two kinds of *settled*)
        console.error(error);
    });

    【讨论】:

    • FWIW,我在我的新书 JavaScript: The New Toys 的第 8 章中详细介绍了 Promise。如果您有兴趣,请在我的个人资料中链接。
    猜你喜欢
    • 1970-01-01
    • 2017-11-29
    • 2019-04-19
    • 2019-09-25
    • 2017-10-18
    • 2016-07-30
    • 2018-11-21
    • 2014-10-08
    • 1970-01-01
    相关资源
    最近更新 更多