uniapp 封装request 网络请求

最新推荐文章于 2024-08-05 14:12:53 发布

世俗ゝ

最新推荐文章于 2024-08-05 14:12:53 发布

阅读量1k

点赞数

分类专栏： uniapp 文章标签： uniapp uni-app

本文链接：https://blog.csdn.net/wangongchao/article/details/113250279

版权

本文介绍了在uniapp项目中封装网络请求的步骤，包括创建config.js配置接口基础路径、utils/api.js文件实现请求逻辑、models/index.js创建model层以及如何在页面中调用这些封装好的请求。

摘要由CSDN通过智能技术生成

每个项目开始前，都要做好充分的准备工作，网络封装必不可少直接上代码

1.根目录下新建 config.js 文件

const config = {
base_url: '这里可以是生产环境或者测试环境'
}
export { config }

这里主要配置接口的基本路径

2.根目录下新建 utils/api.js 文件 (js文件名随便取大部分都是 api.js 或者 http.js)

import {
	config
} from '../config.js'

export const apiResquest = (prams) => { //prams 为我们需要调用的接口API的参数 下面会贴具体代码

	// 判断请求类型
	let headerData = {
		'content-type': 'application/json'
	}

	let dataObj = null
        //因为我们的GET和POST请求结构不同这里我们做处理，大家根据自己后台接口所需结构灵活做调整吧
	if (prams.method === "GET") {
		headerData = {
			'content-type': 'application/json',
			'token': uni.getStorageSync('token')
		}
	} else {
		dataObj = {
			'data': prams.query,
			'token': uni.getStorageSync('token')
		}
	}
	return ne