封装uniapp request promise化

uniapp request 封装

  • [一、 封装方法](#一、 封装方法)
    • [1. 使用 promis 封装 request](#1. 使用 promis 封装 request)
    • [2. 封装 api 在 api.js](#2. 封装 api 在 api.js)
    • [3.在要请求的页面 调用 api](#3.在要请求的页面 调用 api)

一、 封装方法

1. 使用 promis 封装 request

js 复制代码
const BASE_URL = '你的url接口' //比如  http://198.12.3.3/pz

export function request(config = {}){
	let {
			url,
			data = {},
			method = 'GET',
			header = {},
		} = config
		url = BASE_URL+url
		header['access-key'] = "您的key值"
		header['token'] = '您的toekn值'
		retrun new Promise((resolve, reject) => {
			uni.request({
				url,
				data,
				method,
				header,
				success:(res) =>{
					if(res.data.errCode === 0){
						resolve(res.data)
					}else if(res.data.errCode === 400){
						uni.showModal({
							title:'错误提示',
							content: res.data.errMsg,
							showCancel:false
						})
						resolve(res.data)
					}else{
						uni.showToast({
							title:res.data.errMSg,
							icon:'none'
						})
				},
				fail: (err) =>{
					reject(err)
				}
				
			})
		)
}

2. 封装 api 在 api.js

js 复制代码
	import {request} from '@/util/request'
	export function apiGetOrder(data = {}){
		return request({
			url:'您要拼接的url' //比如/order/list
		})
	}

3.在要请求的页面 调用 api

js 复制代码
		import {apiGetOrder} from '@/api/api.js'
		const getOrder = async () =>{
		let res = await apiGetOrder()
		orderList.value = res.data
		console.log(res.data);
	}

注意

提供的url 都是虚拟

如有错误请告知

如有侵权请带着截图发邮件

邮箱 1413229255@qq.com

相关推荐
你的电影很有趣23 分钟前
lesson77:Vue组件开发指南:从基础使用到高级通信
javascript·vue.js·1024程序员节
Mr.Jessy43 分钟前
JavaScript学习第六天:函数
开发语言·前端·javascript·学习·html·1024程序员节
code_YuJun1 小时前
管理系统——应用初始化 Loading 动画
前端
oak隔壁找我1 小时前
JavaScript 模块化演进历程:问题与解决方案。
前端·javascript·架构
Elieal1 小时前
AJAX 知识
前端·ajax·okhttp
sulikey2 小时前
Qt 入门简洁笔记:从框架概念到开发环境搭建
开发语言·前端·c++·qt·前端框架·visual studio·qt框架
社会底层无业大学生2 小时前
uniapp微信小程序简单表格展示
微信小程序·小程序·uni-app·vue·1024程序员节
烟袅2 小时前
JavaScript 变量声明报错指南:var、let、const 常见错误解析
javascript
烟袅2 小时前
告别 var!深入理解 JavaScript 中 var、let 和 const 的差异与最佳实践
javascript·面试
烛阴2 小时前
循环背后的魔法:Lua 迭代器深度解析
前端·lua