React 实现请求接口封装

接口封装

一、正常接口请求

useEffect(()=>{//获取下拉数据async function fetchDateWrapper() {try{const res = await 接口();console.log("res",res.data);const value = res.data.map(item ={return { label: item.valueName,value:valueCode }});setData(value);console.log("aaa",value);} catch (error) {} finally {}fetchDateWrapper();
},[])

二、antd组件请求封装

 request={async (params) => {const { current: pageNum, pageSize, ...otherParams } = params;if(otherParams?.yearMonth){otherParams.beginDate=dayjs(otherParams?.yearMonth[0]).format('YYYY-MM')otherParams.endDate=dayjs(otherParams?.yearMonth[1]).format('YYYY-MM')}console.log('查询机构提交参数', {pageCurrent: pageNum,pageSize,...otherParams,});//return []let {data,success,} = await pageQry({pageCurrent: pageNum,pageSize,...otherParams,});console.log("data", data)console.log("data.pageInfo.records", data.pageInfo.records)let aaa = data.pageInfo.recordsconst bbb = aaa.map((item: any, index: number) => {// console.log("itemitemitemitem", item)item.no = Number(pageSize) * (Number(pageNum) - 1) + index + 1;return { ...item };});setDataSourceS(bbb)return {// data: dataSource,success,total: data.pageInfo.total,};}}

出自 申创衡金科技网络有限公司