从数组映射函数的async / await返回值

时间:2018-07-22 06:23:27

标签: javascript

在弄清楚如何使以下代码在javascript / react中工作时遇到麻烦;

findSupplierName(supplierId) {
   var object = this.state.supplierData.find(e => e.id === supplierId).name;
   return object;
}

我有两个API调用返回数组,一个包含订单,另一个包含供应商信息。我正在尝试从订单数组中找到vendor_id,从供应商数组中找到一个名称。

<tbody>
   {this.state.data.map((data, i) =>
   <tr key={i}>
     <td>{data.id}</td>
     <td>{this.findSupplierName(data.supplier_id)}</td>
     <td>{data.date}</td>
     <td>{data.total}</td>
   </tr>)}
</tbody>

我曾尝试使用async / await,但无法弄清楚(这里是Javascript新手)。大多数情况下,代码会失败,因为find函数需要一段时间才能找到信息。

1 个答案:

答案 0 :(得分:1)

原因 JavaScript的map函数可用于数组,并且最初this.state.data是未定义的,直到获得来自ajax请求的响应为止。

您必须切换async: false。那么请求的数据将被接收,其余的代码将在接收到数据后立即运行。