Uniapp微信小程序开发:http请求封装。

在微信小程序开发中,http请求是一个非常重要的环节。虽然腾讯官方提供了相应的Api,但是如果直接使用这些Api的话,每次请求都非常麻烦。

在实战中,需要首先将其包装一下,让其变得更好用。

比如,我的请求的代码是这样写的:

javascript 复制代码
const reload = () => {
		MyAPI.getDevices()
		.then(res => {
			deviceList.value = res.list
		}).catch(err => {
			console.warning('err', err)
		})
	}

在页面中只需一个简单的MyAPI.getDevices(),就可以完成http的请求。是不是很简单呢?

再仔细看,它可是进行了网络请求的哦,还有,请求的时候,还顺带进行了身份认证的哦。

如果请求成功了,那么就会得到结果res,在res中有一个list属性,这是一个数组。

如果请求出错了,这里只是打印出错误信息,当然还可以进一步处理的。这里就省略了。

在这样的请求中,只关心业务逻辑,而不需要关心底层的实现。

如果再加个参数呢?

javascript 复制代码
const reload = () => {
		MyAPI.getDevice(MyAPI.getDeviceId())
		.then(res => {
			device.value = res
		}).catch(err => {
			console.warning('err', err)
		})
	}

你发现,虽然函数不同,但是使用的形式都是一样的。

通过这样的封装,可以将所有用得到的http请求都封装成这样,在编码中统一形式和风格。

相关推荐
游戏开发爱好者810 小时前
iOS 商店上架全流程解析 从工程准备到审核通过的系统化实践指南
android·macos·ios·小程序·uni-app·cocoa·iphone
toooooop811 小时前
Vuex 中 state、mutations 和 actions 的原理和写法
前端·javascript·uni-app
项目題供诗11 小时前
微信小程序黑马优购(项目)(一)
微信小程序·小程序
项目題供诗11 小时前
微信小程序黑马优购(项目)(三)
微信小程序·小程序
林_xi11 小时前
uniapp使用@uni-ku/root插件实现全局组件
前端·uni-app
计算机毕设定制辅导-无忧学长12 小时前
基于uni-app的“民族风韵”特色购物小程序
uni-app
一个处女座的程序猿O(∩_∩)O12 小时前
UniApp 生命周期全解析:从应用到页面,再到组件的完美协奏曲
前端·uni-app
H_ZMY13 小时前
微信小程序 mp-html:专为小程序设计的富文本渲染组件
微信小程序·小程序·html
国服第二切图仔13 小时前
Electron for 鸿蒙PC实战案例Gitcode口袋工具之HTTP请求封装的技术实现与设计解析
http·electron·gitcode
你听得到1114 小时前
Web前端们!我用三年亲身经历,说说从 uniapp 到 Flutter怎么转型的,这条路我爬过,坑我踩过
前端·flutter·uni-app