【Ant Design Pro】接口联调

之前开发写代码的时候，所有的数据都是通过接口mock模拟的假数据，当前端的代码编写完毕，后端的接口也已经写好之后，我们就需要把mock假数据干掉，使用后端提供的数据，进行前后端的一个调试，这个过程我们就把它称之为前后端的接口联调。

一、需要在config/config.js 给proxy 配置代理

 1 proxy:{
 2    "/之前的接口/"：{
 3       target:"http://...",
 4       changeOrigin:ture
 5   },
 6   "/最新接口/"：{
 7      target:"最新的后台地址'，
 8        changeOrigin:ture
 9   }
10 }

二、mock和service换成接口连接

以上篇最后为例

mock

1 export default{
2   "POST /****接口地址****/queryApplicationList":queryApplicationList,//查询接口
3   "POST /****接口地址****/createApplicationList":createApplicationList,//新建接口
4   "POST /****接口地址****/deteleApplicationList":deleteApplicationList//删除接口
5 }

service

 1 import request from "@/utils/request";
 2 
 3 export async function queryApplicationList(payload){
 4    return request("/****接口地址****/queryApplicationList",{
 5        method:"POST",
 6        data:payload
 7   })：
 8 }
 9 export async function createApplicationList(payload){
10    return request("/****接口地址****/createApplicationList",{
11        method:"POST",
12        data:payload
13   })：
14 }
15 export async function deleteApplicationList(payload){
16    return request("/****接口地址****/deleteApplicationList",{
17        method:"POST",
18        data:payload
19   })：
20 }

mock注释export default显示后台返回的真实数据，不注释还是假数据。

二、检测要点

1、是否成功返回服务器

2、参数、字段名是否一致

3、功能接口是否能成功操作

...