request 指的是小程序中的網絡請求，在 mpvue框架中可以通過小程序提供的原生 API wx.request 來進行相關的處理。但是在這里推薦一個第三方的網絡請求庫 fly。之所以推薦這個第三方庫，是因為可以在多個端上實現代碼的復用，目前已支持的有 Node.js 、微信小程序 、Weex 、React Native 、Quick App。
mpvue沒配置請求方式時碰到如下圖的錯誤：
原因
報錯的內容是，非法的url。
你的請求地址只有路徑，沒有域名，肯定是非法的呀，就是webpack打包重寫的時候沒加上域名的原因
原生 API wx.request 能用,但不是最好的方法,最好的還是fly,因為為了以后多平台的考慮,最好使用fly.js
進入正題：
01.做之前先關閉校驗合法域名,因為我沒在后台進行配置。后台進行配置合法域名,按着官方給的配置就OK了,這里就不寫了,因為只是個測試,用的都是測試的appid
https://developers.weixin.qq.com/miniprogram/dev/framework/ability/network.html
02.新建fly 文件 src>utils>fly.js
fly.js 內容如下： （其中const host = ‘ ’ 就是你自己需要配置的域名，記着加http）
//定義請求地址
const host = 'http://1.119.44.250:8081/';
function request(url, method, data, header = {}) {
wx.showLoading({
title: '加載中'
})
return new Promise((resolve, reject) => {
wx.request({
url: host + url,
method: method,
data: data,
headers: {
'content-type': 'application/json' // 默認轉為json格式
},
success: function(res) {
wx.hideLoading();
resolve(res.data)
},
fail: function(error) {
wx.hideLoading();
reject(false)
},
complete: function() {
wx.hideLoading();
}
})
})
}
function get(obj) {
return request(obj.url, 'GET', obj.data)
}
function post(obj) {
return request(obj.url, 'POST', obj.data)
}
export default {
request,
get,
post
}
03.根目錄下的main.js中引入
import Vue from 'vue'
import App from './App'
import fly from './utils/fly'
Vue.prototype.$http = fly;
Vue.config.productionTip = false
App.mpType = 'app'
const app = new Vue(App)
app.$mount()
04.頁面中使用
this.$http.post({
url:"lives/getinfo",
data:{
"token":"admintoken",
"uid":"100101",
}
}).then(res =>{
console.log(res.status)
if(res.status == 1) {
this.user.userInfo = res.data
} else {
wx.showToast({
title: '系統開小差',
icon: 'loading',
duration: 2000,
mask: true,
});
}
});
