react+es6+antd5.13.2+ts 如何用async, await方法调用接口？同步方法

kakaxiD

已于 2024-02-05 10:42:12 修改

阅读量206

点赞数 1

文章标签： react.js es6 javascript

于 2024-02-05 09:40:02 首次发布

本文链接：https://blog.csdn.net/kakaxiD/article/details/136036371

版权

1.首先把写好的接口引入：

import { xxx } from '@/apis/';

 // ==========调用接调口处==========
  const getTableList = async () => {
    try {
      setLodingFlag(true);
      const obj = {
        year: '', // 年份
        pageNum: current,
        pageSize,
        projectNameId: inputChange, // 
        finalReviewResult: selectActive, // 
        orderDate: dateSelectionParameters, // 
      };
      const res = await xxx({ ...obj });
      if (res?.code === 200 && res?.data) {
        setDataSource(res?.data?.records || []);
        setTableTolal(res?.data?.total || 0);
        setPageSize(res?.data?.size || 10);
        setCurrent(res?.data?.current || 1);
      } else {
        setDataSource([]);
        message.error(res.msg);
      }
    } catch (e: any) {
      message.error(e.message);
    } finally {
      setLodingFlag(false);
    }
  };
  useEffect(() => {
    queryTableData();
  }, [searchFiled]);


同步方法：
  const getResumeName = () => {
    const params = {
      candidateId: info?.candidateId, // 
    };
    getCandidateInfo(params).then((res: any) => {
      if (res?.code === 200 && res?.data) {
        setResumeName(res?.data?.orderType);
      } else {
        message.error(res?.msg || '查询失败');
      }
    }).catch((err) => {
      message.error(err?.message || '查询失败');
    });
  };