1. Новый запрос.js
Создайте новый общий файл в каталоге и создайте новый request.js в общем файле. Структура каталогов выглядит следующим образом:
common/request.js
Напишите в request.js:
var baseUrl = 'http://localhost:9999' //基本路径
//接口封装
function request(datas) {
//Promise 异步编程的一种解决方案
var promise = new Promise((resolve, reject) => {
uni.request({
url: baseUrl + datas.url,
data: datas.data || {
},
method: datas.method || 'GET',
header: {
'Authorization':'Bearer '+ datas.Authorization, //token
'content-type': datas.type ||
'application/json;charset=UTF-8', //内容类型(默认 application/json;charset=UTF-8)
},
success: function(res) {
resolve(res)
},
fail: function(err) {
console.log(err)
reject(err)
}
})
})
return promise;
}
module.exports = request;
2. Внедрить в main.js
import request from "common/request.js"//封装接口请求
Vue.prototype.requestfs=request //封装接口请求
Примечание: requestfs в Vue.prototype.requestfs=request используется для вызова аксиом в будущих проектах, см. использование.
3. Использование аксиом на практике
использовать шаблон
Используйте следующий интерфейс кода непосредственно в методе и заполните фактический путь и параметры интерфейса. Поскольку предложение
Vue.prototype.requestfs=request //запрос интерфейса инкапсуляции было написано во время инкапсуляции , то this.requestfs можно использовать непосредственно при вызове axios.
this.requestfs({
url: '',//填写请求路径
data: '',//填写参数(看后端是什么传参方式)
method: "POST", //填写请求,GET默认不写本行代码
Authorization: this.token, //填写token (看接口请求是否需要传token)
}).then(res => {
//if (res.data.msg == "success") { //根据后端返回数据判断
console.log("请求成功",res)
//}
})
Случаи использования
1. Возьмем в качестве примера GET-запрос, простейший список рендеринга данных запроса
При инкапсуляции по умолчанию используется запрос GET, поэтому вам нужно только указать URL-адрес пути запроса в методе.
onShow() {
this.getHot()
},
methods: {
getHot() {
this.requestfs({
url: '/mall/goods/selectHotList?type=' + ''
}).then(res => {
if (res.data.msg == "success") {
this.productsList = res.data.data
}
})
},
}
2. Взяв в качестве примера запрос GET, требуется токен
onShow() {
var bs = uni.getStorageSync('UserInformation')
this.token = bs.usertoken
this.getData()
},
methods: {
getData() {
this.requestfs({
url: '/mall/customer/address/selectAddress',
Authorization: this.token,
}).then(res => {
this.data = res.data.data
})
},
}