当前位置: 首页 > news >正文

uniapp接口请求api封装,规范化调用

封装规范和vue中的差不多,都是统一封装成一个request对象,然后在api.js里面调用。

先创建一个utils文件夹,然后里面创建一个request.js,代码如下:

export const baseURL = '基础url地址'const request = (options) => {// 判断是不是完整的地址,不是的话,拼接上baseUrllet urlPath = ""if (options.url.indexOf("http") === -1) {urlPath = baseURL + options.url} else {urlPath = options.url}console.log("请求的url是:", urlPath);return new Promise((resolve, reject) => {uni.request({url: baseURL + options.url, //接口地址:前缀+方法中传入的地址method: options.method || 'GET', //请求方法:传入的方法或者默认是“GET”data: options.data || {}, //传递参数:传入的参数或者默认传递空集合header: {'token': uni.getStorageSync("token") || "" //自定义请求头信息},success: (res) => {// 成功返回console.log("返回数据:", res)resolve(res.data.response_data)},// 这里的接口请求,如果出现问题就输出接口请求失败fail: (err) => {console.log("请求错误:", err)reject(err)}})})
}export default request

在api文件夹中封装对应的index.js文件,然后导入request对象:

import request from '@/utils/request'export default {getUUID(data) {console.log("getUUID");return request({url: '/user/wxapp',method: 'get',data,})},changeStatus(data) {return request({url: '/message/isReads',method: 'post',data,})},getMsgType(params) {return request({url: '/message/messageType',method: 'get',params,})},deleteMsg(data) {return request({url: '/message/delete',method: 'post',data,})},
}

在对应的vue或者react中引入并调用:

相关文章:

  • js中数组的相关方法
  • LabVIEW开发基于图像处理的车牌检测系统
  • Linux Centos7安装后,无法查询到IP地址,无ens0,只有lo和ens33的解决方案
  • gin 框架出现runtime error: index out of range [0] with length 0
  • python3+requests+unittest实战详解(一)
  • 基于51单片机的温度测量报警系统的设计与制作
  • 基于SpringBoot+Vue的服装销售系统
  • bitlocker 加密锁定的固态硬盘,更换到别的电脑上,怎么把原密钥写进新电脑TPM芯片内,开启无需手动填密钥
  • java 读取pdf文件内容
  • 说一说ajax的请求过程?
  • dd命令用法学习,是一个功能强大的工具
  • docker搭建waline评论系统
  • Vue 3响应式对象: ref和reactive
  • Ubuntu 20.04 上安装和使用 Docker
  • Spring MVC的常用注解
  • [Vue CLI 3] 配置解析之 css.extract
  • Docker 笔记(2):Dockerfile
  • Docker入门(二) - Dockerfile
  • Java 实战开发之spring、logback配置及chrome开发神器(六)
  • mysql外键的使用
  • PAT A1017 优先队列
  • python_bomb----数据类型总结
  • SpriteKit 技巧之添加背景图片
  • windows下使用nginx调试简介
  • XML已死 ?
  • 从零开始的webpack生活-0x009:FilesLoader装载文件
  • 技术攻略】php设计模式(一):简介及创建型模式
  • 马上搞懂 GeoJSON
  • 浅谈web中前端模板引擎的使用
  • 携程小程序初体验
  • 容器镜像
  • 正则表达式-基础知识Review
  • #pragma 指令
  • #数学建模# 线性规划问题的Matlab求解
  • (1)虚拟机的安装与使用,linux系统安装
  • (aiohttp-asyncio-FFmpeg-Docker-SRS)实现异步摄像头转码服务器
  • (Bean工厂的后处理器入门)学习Spring的第七天
  • (echarts)echarts使用时重新加载数据之前的数据存留在图上的问题
  • (保姆级教程)Mysql中索引、触发器、存储过程、存储函数的概念、作用,以及如何使用索引、存储过程,代码操作演示
  • (附源码)spring boot智能服药提醒app 毕业设计 102151
  • (附源码)ssm跨平台教学系统 毕业设计 280843
  • (循环依赖问题)学习spring的第九天
  • (一)python发送HTTP 请求的两种方式(get和post )
  • (一)硬件制作--从零开始自制linux掌上电脑(F1C200S) <嵌入式项目>
  • (转)视频码率,帧率和分辨率的联系与区别
  • (最完美)小米手机6X的Usb调试模式在哪里打开的流程
  • .Net - 类的介绍
  • .NET Framework Client Profile - a Subset of the .NET Framework Redistribution
  • .NET Standard / dotnet-core / net472 —— .NET 究竟应该如何大小写?
  • .Net环境下的缓存技术介绍
  • .sys文件乱码_python vscode输出乱码
  • /bin/bash^M: bad interpreter: No such file ordirectory
  • /etc/motd and /etc/issue
  • [Angular] 笔记 6:ngStyle
  • [AS3]URLLoader+URLRequest+JPGEncoder实现BitmapData图片数据保存