【Ant Design Pro】接口聯調

之前開發寫代碼的時候，所有的數據都是通過接口mock模擬的假數據，當前端的代碼編寫完畢，后端的接口也已經寫好之后，我們就需要把mock假數據干掉，使用后端提供的數據，進行前后端的一個調試，這個過程我們就把它稱之為前后端的接口聯調。

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

proxy:{
   "/之前的接口/"：{
      target:"http://...",
      changeOrigin:ture
  },
  "/最新接口/"：{
     target:"最新的后台地址'，
       changeOrigin:ture
  }
}

二、mock和service換成接口連接

以上篇最后為例

mock

export default{
  "POST /****接口地址****/queryApplicationList":queryApplicationList,//查詢接口
  "POST /****接口地址****/createApplicationList":createApplicationList,//新建接口
  "POST /****接口地址****/deteleApplicationList":deleteApplicationList//刪除接口
}

service

import request from "@/utils/request";

export async function queryApplicationList(payload){
   return request("/****接口地址****/queryApplicationList",{
       method:"POST",
       data:payload
  })：
}
export async function createApplicationList(payload){
   return request("/****接口地址****/createApplicationList",{
       method:"POST",
       data:payload
  })：
}
export async function deleteApplicationList(payload){
   return request("/****接口地址****/deleteApplicationList",{
       method:"POST",
       data:payload
  })：
}

mock注釋export default顯示后台返回的真實數據，不注釋還是假數據。

二、檢測要點

1、是否成功返回服務器

2、參數、字段名是否一致

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

...