微信小程序中封装wepy.request请求方法

本文介绍了在微信小程序中如何封装wepy.request请求方法,以实现请求路径的统一管理和权限设置,提高前后端联调效率。通过创建request.js文件集中管理基础路径,并在home.js等组件中引入使用,简化代码,提升开发效率。

微信小程序中封装wepy.request请求方法

通常情况下,我们使用wepy开发微信小程序项目时,是这样请求数据的:
home.js:

// 引入小程序框架
import wepy from 'wepy'
// 获取轮播图数据
export const getSwiperData = function () {
	return wepy.request({
		url: 'http://localhost:8888/api/public/v1/home/swiperdata',
		method: 'GET'
	})
}
// 获取分类数据
export const getCategoryData = function () {
	return wepy.request({
		url: 'http://localhost:8888/api/public/v1/home/catitems',
		method: 'GET'
	})
}

然而,如果像上面这样写的话,当如果遇到前后端联调就会很不方便,因为每一次的请求路径都是分开的,独立的 ;当系统有权限设置的时候就跟不方便了,所以我们最好是能将异步请求的基础路径提取出来.
所以我们新建一个文件:

request.js:

/**
 * 定制封装 wepy.request 请求方法
 * 定制基础路径,公共的请求头
 */
 // 引入小程序框架
import wepy from 'wepy'
// 设置基础路径
const baseUrl = 'http://localhost:8888/api/public/v1/'
// 暴露方法
export default function (params) 
    params.url = baseUrl + params.url
    return wepy.request(params)
}

然后,将之前的文件也需要做一些处理:

home.js:

// 引入已经封装好的request请求
import request from './request.js'
// 获取轮播图数据
export const getSwiperData = function () {
	return request({
		url: 'home/swiperdata',
		method: 'GET'
	})
}
// 获取分类数据
export const getCategoryData = function () {
	return request({
		url: 'home/catitems',
		method: 'GET'
	})
}

这样的话,又省力又方便哦~

评论 1
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值