ant design mock接口配置

1,891 阅读1分钟

1、services/api.js

添加接口

export async function getDataCode(params) {
  return request('/mock/datamap/datacode/15');
}

2、mock文件夹下添加datamap.js文件

export const getDataCode = (req, res) => {
  res.json({
    code: 'success',
    data: {
      total: 100,
      list: [ {
        id: 2,
        name: '缴费流程',
        hasTemplate: true,
      }],
    },
  });
};

export default {
  getDataCode,
};

3、.roadhogrc.mock.js

import { getDataCode } from './mock/datamap';

proxy变量里添加:

  'GET /mock/datamap/datacode/15': getDataCode,

4、页面文件里使用接口

 import { getDataCode } from '../../../services/api';
 
   showDrawer = (id) => {
   // mock 数据
   getDataCode({
     id: id,
   }).then((res) => {
     if (res && res.code === 'success') {
     /*  this.setState({
         historyKpis: (response.data.list || []).filter((item) => {
           return item.isPlanData === record.isPlanData;
         }),
         visible: true,
         title: record['指标名称'],
       });*/
     console.log('res', res.data);
     } else {
       message.error('历史数据未取到!');
     }
   });

   this.setState({
     visible: true,
   });
 }