我们平常是怎么调用接口的呢?在Vue中我们平常通过axios这个库来调用就接口,但是在uniapp进行开发,那么就要借用uniapp的库来进行开发,接下来我们一起来探究下。
一.uni.request(OBJECT) 作用:发送网络请求
OBJECT参数说明:
1.url 类型:String
必填:是
默认值:无
说明:开发者服务器接口地址
2.data 类型:Object/String/ArrayBuffer
必填:是
默认值:无
说明;请求的参数
3.header 类型:Object
必填:否
默认值;无
说明:设置请求的header,header中不能设置Referer
平台差异说明:APP ,H5端会自动带上cookie,且H5端不可手动修改
4.method 类型: String
必填:否
默认值:GET
5.timeout 类型:Number
必填:否
默认值:超过时间,单位ms
6.dataType 类型:String
必填:否
默认值:json
说明:如果设为json,会尝试对返回的数据做一次JSON.parse
7.responseType 类型:String
必填:否
默认值:text
说明:设置响应的数据类型,合法值:text,arraybuffer
8.sslVerify 类型:Boolean
必填:否
默认值:true
说明:验证ssl证书
9.success 类型:Function
必填:否
默认值:无
说明:收到开发者服务器成功返回的回调函数
10.fail 类型:Function
必填:否
默认值:无
说明:接口调用失败的回调函数
11.complete 类型:Function
必填:否
默认值:无
说明:接口调用结束的回调函数(调用成功,失败都会执行)
二.method有效值 注意:method有效值必须大写,每个平台支持的method有效值不同,详情见下表。
三.success返回参数说明
data数据说明 最终发送给服务器的数据是String类型,如果传入的data不是String类型,会被转换成String。转换规则如下:
对于 GET 方法,会将数据转换为 query string。例如 { name: 'name', age: 18 } 转换后的结果是 name=name&age=18。 对于 POST 方法且 header['content-type'] 为 application/json 的数据,会进行 JSON 序列化。 对于 POST 方法且 header['content-type'] 为 application/x-www-form-urlencoded 的数据,会将数据转换为 query string 四.使用uniapp发送一个成功的请求 我使用的是mockfast来模拟一个服务器从而达到发送请求的目的。
1.准备好一个mock来模拟数据
2.给按钮绑定一个点击事件,通过success成功的回调来获取数据 代码