antdpro 寫後臺管理系統的坑

1.antd-pro 配置請求代理

新項目中使用antd-pro框架，因此接下來會寫一些關於antd-pro的踩坑

antd-pro中用的是fetch來實現http請求，封裝成功一個request方法，在本地聯調的時候須要該代理，經過本地服務器來請求後端服務，在部署到線上時須要使用nginx作反向代理

須要在config/config.js 添加下面代碼

proxy: {
'/api/': { //匹配全部以/api/爲開頭的接口
target: 'http://xxxx/', //後端服務器地址
changeOrigin: true,
pathRewrite: { '^/api/': '' }, //由於咱們項目的接口前面並無api 因此直接去掉
},
},
關於changeOrigin這個選項：

若是後端服務託管在虛擬主機的時候，也就是一個IP對應多個域名，須要經過域名區分服務，那麼參數changeOrigin必須爲true(默認爲false)，這樣纔會傳遞給後端正確的Host頭，虛擬主機才能正確迴應。不然http-proxy-middleware會原封不動將本地HTTP請求發日後端，包括Host: localhost而不是Host: httpbin.org，只有正確的Host才能使用虛擬主機，否則會返回404 Not Found。

通常狀況下直接設置爲true就能夠了

可能會遇到掛設代理仍是沒法請求真實接口的狀況，能夠用 npm run start:no-mock 試試看

2.打包配置（配置二級目錄路由）

hash

history

3.使用overflow：scroll；（windows系統會有問題）

::-webkit-scrollbar {

/*隱藏滾輪*/

display: none;

}

4.登錄實現驗證碼局部刷新