封裝規(guī)范和vue中的差不多,都是統(tǒng)一封裝成一個request對象,然后在api.js里面調(diào)用。
先創(chuàng)建一個utils文件夾,然后里面創(chuàng)建一個request.js,代碼如下:
export const baseURL = '基礎(chǔ)url地址'
const request = (options) => {
// 判斷是不是完整的地址,不是的話,拼接上baseUrl
let urlPath = ""
if (options.url.indexOf("http") === -1) {
urlPath = baseURL + options.url
} else {
urlPath = options.url
}
console.log("請求的url是:", urlPath);
return new Promise((resolve, reject) => {
uni.request({
url: baseURL + options.url, //接口地址:前綴+方法中傳入的地址
method: options.method || 'GET', //請求方法:傳入的方法或者默認是“GET”
data: options.data || {}, //傳遞參數(shù):傳入的參數(shù)或者默認傳遞空集合
header: {
'token': uni.getStorageSync("token") || "" //自定義請求頭信息
},
success: (res) => {
// 成功返回
console.log("返回數(shù)據(jù):", res)
resolve(res.data.response_data)
},
// 這里的接口請求,如果出現(xiàn)問題就輸出接口請求失敗
fail: (err) => {
console.log("請求錯誤:", err)
reject(err)
}
})
})
}
export default request
在api文件夾中封裝對應(yīng)的index.js文件,然后導(dǎo)入request對象:文章來源:http://www.zghlxwxcb.cn/news/detail-715906.html
import request from '@/utils/request'
export default {
getUUID(data) {
console.log("getUUID");
return request({
url: '/user/wxapp',
method: 'get',
data,
})
},
changeStatus(data) {
return request({
url: '/message/isReads',
method: 'post',
data,
})
},
getMsgType(params) {
return request({
url: '/message/messageType',
method: 'get',
params,
})
},
deleteMsg(data) {
return request({
url: '/message/delete',
method: 'post',
data,
})
},
}
在對應(yīng)的vue或者react中引入并調(diào)用:文章來源地址http://www.zghlxwxcb.cn/news/detail-715906.html
到了這里,關(guān)于uniapp接口請求api封裝,規(guī)范化調(diào)用的文章就介紹完了。如果您還想了解更多內(nèi)容,請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!