uni app 封装接api接口
创建文件 base.js
let baseURL = '';
// 是否在控制台显示接口请求日志,本地环境启用,打包环境禁用
let showHttpLog = false;
// 测试环境
baseURL = 'https://api.apiopen.top/api';
// 正式环境
// baseURL = 'XXXXX.XXXXX.com';
module.exports = {
baseURL: baseURL,
showHttpLog: showHttpLog
}
创建文件 http.js
import {
baseURL
} from './base.js'; //导入接口的前缀地址
export const myRequest = (options) => {
return new Promise((resolve, reject) => {
uni.request({
url: baseURL + options.url, //接口地址:前缀+方法中传入的地址
method: options.method || 'GET', //请求方法:传入的方法或者默认是“GET”
data: options.data || {}, //传递参数:传入的参数或者默认传递空集合
dataType: options.dataType || "json",
headers: {
'Authorization ': window.localStorage.getItem('token') //自定义请求头信息
},
success: (res) => {
//返回的数据(不固定,看后端接口,这里是做了一个判断,如果不为true,用uni.showToast方法提示获取数据失败)
// if (res.data.success != true) {
// return uni.showToast({
// title: '获取数据失败',
// icon: 'none'
// })
// }
// 如果不满足上述判断就输出数据
resolve(res)
},
// 这里的接口请求,如果出现问题就输出接口请求失败
fail: (err) => {
console.log(err)
reject(err)
}
})
})
}
创建文案 lojin.js文件
import {myRequest} from './http.js'
export function login () { //登录
return myRequest({
url:'/getHaoKanVideo?page=0&size=10',
method:'get',
})
}
使用
methods: {
async tijiao(){ //事件
let res = await login()
console.log(res);
}
}
uni app 封装接api接口的更多相关文章
- vue中Axios的封装和API接口的管理
前端小白的声明: 这篇文章为转载:主要是为了方便自己查阅学习.如果对原博主造成侵犯,我会立即删除. 转载地址:点击查看 如图,面对一团糟代码的你~~~真的想说,What F~U~C~K!!! 回归正题 ...
- Vue中axios的封装和api接口的统一管理
更新的是我csdn上的文章,需要的话可以看下,互相学习点击去我的csdn vue中axios的封装 在vue项目和后端交互获取数据时,通常使用axios库,官方文档:https://www.npmjs ...
- 浅谈使用 PHP 进行手机 APP 开发(API 接口开发)
做过 API 的人应该了解,其实开发 API 比开发 WEB 更简洁,但可能逻辑更复杂,因为 API 其实就是数据输出,不用呈现页面,所以也就不存在 MVC(API 只有 M 和 C),那么我们来探讨 ...
- 浅谈PHP与手机APP开发即API接口开发
API(Application Programming Interface,应用程序接口)架构,已经成为目前互联网产品开发中常见的软件架构模式,并且诞生很多专门API服务的公司,如:聚合数据(http ...
- 浅谈 PHP 与手机 APP 开发(API 接口开发) -- 转载
转载自:http://www.thinkphp.cn/topic/5023.html 这个帖子写给不太了解PHP与API开发的人 一.先简单回答两个问题: 1.PHP 可以开发客户端? 答:不可以,因 ...
- 浅谈 PHP 与手机 APP 开发(API 接口开发)
本文内容转载自:http://www.thinkphp.cn/topic/5023.html 这个帖子写给不太了解PHP与API开发的人一.先简单回答两个问题:1.PHP 可以开发客户端?答:不可以, ...
- 浅谈PHP与手机APP开发(API接口开发)
了解PHP与API开发 一.先简单回答两个问题: 1.PHP 可以开发客户端? 答:不可以,因为PHP是脚本语言,是负责完成 B/S架构 或 C/S架构 的S部分,即:服务端的开发.(别去纠结 GTK ...
- 【uni-app】uni.request二次封装,更好的管理api接口和使用
前言 之前写了一个Vue.js的axios二次封装(点击跳转),这次是uni-app,uni-app是基于vue.js框架的,我觉得是很好用的一个框架,而且一套代码编译那么多平台,非常节省成本,当然, ...
- uni-app 环境配置,uni.request封装,接口配置,全局配置,接口调用的封装
1.环境配置 (可参考uni-官网的环境配置) common文件夹下新建config.js let url_config = "" if(process.env.NODE_ENV ...
- 【vue】axios二次封装,更好的管理api接口和使用
在现在的前端开发中,前后端分离开发比较主流,所以在封装方法和模块化上也是非常需要掌握的一门技巧.而axios的封装也是非常的多,下面的封装其实跟百度上搜出来的axios封装或者axios二次封装区别不 ...
随机推荐
- CSS – W3Schools 学习笔记 (1)
CSS Color Link to W3Schools 这里讲的是 color 的 value, 它可以用在许多属性上, 比如 background-color, color, border-colo ...
- socket close和shutdown的区别,TIME_WAIT和CLOSE_WAIT
TCP主动关闭连接 appl: close(), --> FIN FIN_WAIT_1 //主动关闭socket方,调用close关闭socket,发FIN < ...
- java使用正则表达式验证手机号和电话号码和邮箱号码的方法
验证手机号 我国的手机号一般是以1开头,后面跟着10位数字.因此,可以用如下正则表达式: public static boolean isValidPhoneNumber(String phoneNu ...
- OCR+PDF解析配套前端工具开源详解!
面对日常生活和工作中常见的OCR识别.PDF解析.翻译.校对等场景,配套的可视化工具能够极大地提升我们的使用体验和工作效率. 通过可视化界面,我们可以直观地看到文本识别.解析和翻译的结果,便捷评估产品 ...
- 九问 GBase | 如何看待“科技制裁”?如何助力中国数据库国产化落地?
导读: Oracle.SAP.Apple.Google.Github等国际科技巨头纷纷宣布停止在俄罗斯业务,英特尔.AMD.戴尔等科技企业也被曝已中断向俄供货.当全面科技制裁来临,俄罗斯将如何应对此次 ...
- 玩玩虚拟化-KVM
1.讲在前面(玩这个的心历路程) 最近一段时间想玩一些集群之类的东西,学习搞一下K8s,集群啥的,但是我没有多台服务器,如果购买云服务器成本太高,后来想到了买台台式机弄点虚拟机来玩,于是我就在某鱼上淘 ...
- vue 组件中使用 scoped 有的样式不会生效 解决办法
造成原因:组件的嵌套导致 : 解决:
- element的upload 图片上传主函数
/** 图片上传 */ async UploadImage (event, file, filelist) { // 清空坐标 this.formModel.ITEM_XY = [0, 0] this ...
- 「模拟赛」多校 A 层联训 5
A.好数(number) 很签,打完之后"不是这题我能做一个小时??" 对于每个数,都把它与前面的所有数的加和求一遍存进桶里,再遇到一个新数 \(a_i\) 时,枚举前面的所有 \ ...
- Kubernetes 边缘节点抓不到监控指标?试试这个方法!
KubeSphere v3.1.0 通过集成 KubeEdge,将节点和资源的管理延伸到了边缘,也是 KubeSphere 正式支持边缘计算的第一个版本. 笔者也第一时间搭建和试用了边缘节点相关的功能 ...