最近項目個人覺得比較難得地方瘦陈，在這里分享下
項目描述：
1.此項目為一個前后端分離的外賣 Web App (SPA)
2.包括商家, 商品, 購物車, 用戶等多個功能子模塊
3.使用 Vue 全家桶+ES6+Webpack 等前端最新最熱的技術(shù)
4.采用模塊化赤拒、組件化辽社、工程化的模式開發(fā)
分享的階段是測試完后臺接口雷滋，則需要寫前后臺交互的ajax文件 贫堰，在src/api文件夾下新建index.js與ajax.js首先需要安裝axios
npm install axios--save
一.下面封裝ajax請求函數(shù)
為了實現(xiàn)統(tǒng)一向后端發(fā)送請求數(shù)據(jù)缕溉，所以需要封裝一個ajax請求函數(shù)
bk1.png
通過對axios返回的promise對象再包裝一層Promise的方法剪验，來簡化外部的調(diào)用
二.封裝接口請求函數(shù)
有了發(fā)送請求數(shù)據(jù)的ajax函數(shù)肴焊，還需要封裝一些與后臺交互的接口函數(shù)
根據(jù)接口文檔來定義接口請求函數(shù)
bk2.png
三.配置代理并測試接口實現(xiàn)ajax跨域請求
除了設(shè)置讓服務(wù)器允許跨域的方法之外，還可以通過配置代理實現(xiàn)跨域請求
1.在項目config文件夾下的index.js文件里設(shè)置代理配置表
bk3.png
2.修改api文件夾index.js里接口函數(shù)的請求路徑
bk2.png
3.因為修改了項目的config文件功戚，所以需要重啟項目
npm run dev
4.此時可以在控制臺看到跨域請求到的數(shù)據(jù){code: 0, data: Array(16)}
暫時就這些娶眷，餓了，去吃飯
