9.4 笔记

知识点整理

async和await的使用

一个async函数可以对应多个await操作

因为async函数会返回一个Promise对象，而Promise对象可以被多个await操作等待。当执行到一个await时，如果它等待的Promise对象还没有被解决，那么该操作会被挂起，等待Promise对象被解决后再继续执行。

因此，一个async函数可以在其执行过程中，返回多个Promise对象，而这些Promise对象可以被不同的await操作等待。

项目整理

场景1：formRef.current?.validateFields().then()的异步问题

描述

INFO

在发送请求之前需要先获取到表格中的数据，然后将这些再将这些数据作为参数发送出去

思路

我们一定会使用formRef,调用formRef.current?.validateFields().then(),然后对数据对数据进行设置。

注意：**formRef.current?.validateFields().then()**，这个方法是一个异步的方法，所以我们是需要使用**await**的。

const exportLabelReportItem = async () => {
  // 设置请求参数
  const params: ILabelReportExportParams = {
    ids: selectedRowKeys,//选中的行的key
    itemSn: "",
    containerSn: "",
    docNum: "",
    customerTag: "",
    bindStatus: false,
    itemCode: ""
  }
  // 首先获取formRef的值
  await formRef.current?.validateFields().then((values: ILabelReportTable) => {
    // 设置请求参数
    params['itemCode'] = values.wsiItemCode//物料料号
    params['itemSn'] = values.wsiItemSn//物料SN
    params['docNum'] = values.wsiDocNum//入库单号
    params["customerTag"] = values.customerTag//客户定制标签
    params["containerSn"] = values.containerSn//容器SN
    params["bindStatus"] = values.customerTagBind//是否绑定客户标签
  });
  // 调用接口，异步
  const res = await exportLabelReportTableData(params);
  if (res.success) {
    // 导出excel
    window.open(res.data);
  } else {
    message.error("导出失败")
  }
};

场景2

描述

INFO

现在有一个表单有很多列，如果一下子全部展示，非常的多，此时我们希望使用fixed来实现固定列，但是该表格中存在ellipsis，当两者同时存在的时候，就会不生效。

这样的话，我的物料SN并不会的省略并不会生效。