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

微信小程序中封装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'
	})
}

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

你可能感兴趣的:(微信小程序相关,前端)