发送请求
使用第三方库(@escook/request-miniprogram)
地址:https://www.npmjs.com/package/@escook/request-miniprogram
使用方法该网址都有
开始使用
uni-app中使用:
安装:
npm install @escook/request-miniprogram
导入挂载
// 按需导入 $http 对象
import {
$http } from '@escook/request-miniprogram'
// 将按需导入的 $http 挂载到 wx 顶级对象之上，方便全局调用
wx.$http = $http
// 在 uni-app 项目中，可以把 $http 挂载到 uni 顶级对象之上，方便全局调用
uni.$http = $http
支持的请求方法
// 发起 GET 请求，data 是可选的参数对象
$http.get(url, data?)
// 发起 POST 请求，data 是可选的参数对象
$http.post(url, data?)
// 发起 PUT 请求，data 是可选的参数对象
$http.put(url, data?)
// 发起 DELETE 请求，data 是可选的参数对象
$http.delete(url, data?)
配置请求根路径
$http.baseUrl = 'https://api-hmugo-web.itheima.net/api/public/v1/'
请求拦截器
在请求前做的操作(例如：显示加载动画)
语法:$http.beforeRequest
//请求拦截器
$http.beforeRequest = function (options) {
uni.showLoading({
title: '数据加载中...',
})
}
响应拦截器
请求完成后做的操作(上方显示加载动画,这里就消除动画吧)
响应语法:$http:afterReqiest
关闭动画:hideLoading()
//响应拦截器
$http.afterRequest = function () {
uni.hideLoading()
}
给uni.showToast封装
参数上赋值是es6写法,代表不传参时的默认值
uni.$showMsg=function(title="请求失败",time=1500,icon="error"){
uni.showToast({
title,
duration:time,
icon
})
}
示例
async getNavList(){
let {
data:ret}=await uni.$http.get('home/catitems')
if(ret.meta.status!=200) return uni.$showMsg();
this.navList=ret.message;
console.log(ret)
},
如果返回状态不等于200就调用上方封装的$showMsg()
测试完成~~~~~