封装一个uniapp请求

  • 新建一个http.js文件封装uni.request
const BASE_URL = process.env.NODE_ENV === 'development' ? '' : 'http://localhost:3000'  //开发环境与生还环境的基地址
export const request = (http) => {
const {
url,
data,
method
} = http
return new Promise((resolve, reject) => {
uni.request({
url: BASE_URL + url,
method,
data,
success: (res) => { //请求成功
if (res.data.code === 0) { //这里后台返回一个自定义状态码,可根据实际开发情况调整
resolve(res)
} else {
uni.showToast({
title: '请求数据失败!'
})
}
},
fail: (err) => { //请求失败
uni.showToast({
title: '请求数据失败!'
})
reject(err)
}
})
})
}
  • 新建一个mockData.js来封装每个请求
import {
request
}
from '../utils/http.js'
export const getData = (data) => request({
url: '/v1/admin',
method: 'get',
data
})
  • 实际使用
onLoad() {
//无参数
getData().then(res => {
this.dataList = res.data.data
}).catch(err => {
console.log(err)
})
//有参数
getData({id:2}).then()
},

uniapp封装uni.request请求的更多相关文章

  1. uni-app 封装接口request请求

    我们知道一个项目中对于前期架构的搭建工作对于后期的制作有多么重要,所以不管做什么项目我们拿到需求后一定要认真的分析一下,要和产品以及后台沟通好,其中尤为重要的一个环节莫过于封装接口请求了.因为前期封装 ...

  2. 【uni-app】uni.request二次封装,更好的管理api接口和使用

    前言 之前写了一个Vue.js的axios二次封装(点击跳转),这次是uni-app,uni-app是基于vue.js框架的,我觉得是很好用的一个框架,而且一套代码编译那么多平台,非常节省成本,当然, ...

  3. 微信小程序设置全局请求URL 封装wx.request请求

    app.js: App({ //设置全局请求URL globalData:{ URL: 'https://www.oyhdo.com', }, /** * 封装wx.request请求 * metho ...

  4. uni-app 封装 http promise请求,仅提供 post,all,spread 方法

    简单封装一下 uni-app 的请求,因为项目中只用 post 请求,所以只封装了 post 和 all 方法. 更新,新增 spread 方法 2019-11-22 10:37:21 global. ...

  5. uni-app请求uni.request封装使用

    对uni.request的一些共同参数进行简单的封装,减少重复性数据请求代码.方便全局调用. 先在目录下创建 utils 和 common 这2个文件夹 utils 是存放工具类的,common 用来 ...

  6. uni-app 环境配置,uni.request封装,接口配置,全局配置,接口调用的封装

    1.环境配置 (可参考uni-官网的环境配置) common文件夹下新建config.js let url_config = "" if(process.env.NODE_ENV ...

  7. uni-app开发经验分享十: 封装request请求

    http.js //封装requset,uploadFile和downloadFile请求,新增get和post请求方法 let http = { 'setBaseUrl': (url) => ...

  8. uniapp 封装 request 并 配置跨域,( 本地 + 线上 + 封装 )

    找到上面这个 文件,不管是用 命令创建 还是 用 HBX 创建,都一样会有这个文件的,然后跟着截图复制粘贴就好了. // 这是配置本地能跨域的,或者你可以直接让后端给你设置请求头,避免了跨域. &qu ...

  9. PHP Request请求封装

    /** * Request请求封装 * Class Request * @package tool */ class Request { // curl 请求错误码 protected static ...

随机推荐

  1. C# Dictionary(字典)源码解析&效率分析

    通过查阅网上相关资料和查看微软源码,我对Dictionary有了更深的理解. Dictionary,翻译为中文是字典,通过查看源码发现,它真的内部结构真的和平时用的字典思想一样. 我们平时用的字典主要 ...

  2. shapefile 输出的地理处理注意事项(转载)

    来源:http://resources.arcgis.com/zh-cn/help/main/10.1/index.html#//005600000013000000 多年来,Esri 为存储地理信息 ...

  3. acm的做题技巧

    1.一般用C语言节约空间,要用C++库函数或STL时才用C++; cout.cin和printf.scanf最好不要混用. 大数据输入输出时最好不要用cin.cout,防止超时. (或加上 1 ios ...

  4. L3-002. 堆栈【主席树 or 线段树 or 分块】

    L3-002. 堆栈 时间限制 200 ms 内存限制 65536 kB 代码长度限制 8000 B 判题程序 Standard 作者 陈越 大家都知道"堆栈"是一种"先 ...

  5. mysql 索引类型以及创建

    明天就去面浦发了,感觉对数据库有些忘了,时间紧迫,就直接把链接贴这了,有空再整理. 参考: 1. https://www.cnblogs.com/crazylqy/p/7615388.html

  6. sdut3562-求字典序最小的最短路 按顶点排序后spfa的反例

    首先我们可以这么搞...倒序建图,算出源点s附近的点距离终点的距离,然后判断一下,终点是否能跑到源点 能跑到的话呢,我们就判断s周围的点是否在最短路上,然后我们选编号最小的点就好了 代码 #inclu ...

  7. js array & unshift === push head

    js array & unshift === push head const arr = [1, 2, 3]; console.log(arr.unshift(4, 5)); // 5 con ...

  8. HTML5 动效

    HTML5 动效 motion graphics toolbelt for the web https://github.com/xgqfrms/mojs A collection of loadin ...

  9. Jupyter All In One

    Jupyter All In One Jupyter Architecture https://jupyter.readthedocs.io/en/latest/projects/architectu ...

  10. Versatile Python 3.x

    Versatile Python 3.x TryPython Python 3.8.0 (default, Nov 14 2019, 22:29:45) [GCC 5.4.0 20160609] on ...