Uni-app fly 接口封装

1 在untils文件夹中编写fly.js文件

var Fly = require('flyio/dist/npm/wx');
var fly = new Fly();
fly.config.timeout = 5000;//配置请求基地址
fly.config.baseURL='http://************/';//添加请求拦截器
fly.interceptors.request.use(request => {//给所有请求添加自定义headerrequest.headers['X-Tag'] = 'flyio';// const token = uni.getStorageSync('token');     //关于token的用法// console.log(JSON.stringify(token));// if (token) {// request.headers['Authorization'] = token; // }//可以显式返回request, 也可以不返回，没有返回值时拦截器中默认返回requestreturn request;
});//添加响应拦截器，响应拦截器会在then/catch处理之前执行
fly.interceptors.response.use(response => {//只将请求结果的data字段返回// const {errno,errmsg} = response.data// 这个是正确的状态码，根据实际情况修改// if(errno==1000){return response.data; // 这里直接返回的data，再使用似可以少写次data// } else {// 这里是错误处理，进行错误提示和跳转到未登录页面等//console.error(errmsg) //return Promise.reject(errmsg) // }},err => {//发生网络错误后会走到这里// return Promise.resolve("网络错误")}
);export default fly;

2 编写 API文件夹，里面编写api接口

例 device.js


import fly from '../utils/fly.js';   // 引入fly.js文件export default{// getgetDevice:(params)=>{return fly.get('device',params);     //get方式调取http://***/device}post ·· 方式一样，注意字符串的拼接}

3 在vue页面进行引用

import device from "../../api/device.js"   引入 api文件 device 可以任意取名methods:{getAllDevice : async function(){    const params ={pageSize : 10,currentPage :1}let res = await device.getDevice(params )     //这样写的好处是不存在异步处理，不会影响数据处理顺序console.log(res)}
}

Uni-app fly 接口封装相关推荐

uni app 开发微信小程序及上线体验
uni app 开发微信小程序及上线体验项目创建及微信小程序AppId的申请本次开发的是电商类的微信小程序,这里用到的是HBuilderX这个编辑器.之前用的Visual Studio Code ...
浅析 uniapp(Vue) 的接口封装方法
浅析 uniapp(Vue) 的接口封装方法本文将详细讲解封装思路,通过对接口请求进行封装,实现接口引入即用,减少了请求复杂的属性参数,更加关注数据与业务本身. config - 请求地址及相关参数 ...
切换 uniapp_万能前端框架uni app初探03：底部导航开发
前言本节我们使用uni app的底部导航功能,点击不同tab会显示不同页面,这个功能在实际项目开发中几乎是必备的. 一.基础知识 1.tabBar 如果应用是一个多 tab 应用,可以通过 tabB ...
微信小程序在线考试项目开发-接口封装调用
本项目会耗时一周到两周来完成,最近要又要辛苦加班了,项目给的时间不多,程序员太不容易了,做完项目调休好好休息一下! 此时此刻,记录一下项目实现. 小程序在线考试项目介绍: 技术选型:轻量.可靠的小程序 ...
大众点评app数据采集接口
提供封装好的点评app数据采集接口,接口稳定. 接口使用详情请参考接口文档. 已支持接口列表如下: 根据经纬获取店铺列表(支持店铺类型有:美食,酒吧,ktv,洗浴/汗蒸,按摩/足疗,美容spa,密室, ...
uni App+H5 实现人脸识别
uni App+H5 实现人脸识别通过h5的视频video管理设备摄像头(不要关),在打开视频摄像时快照截取人脸照片传送到后台通过API接口调用百度人脸识别结果并通过返回数据解析自己业务需求. 1. ...
uni app(H5)中软键盘弹出,固定定位绝对定位元素位置发生错乱
一.问题如下最近用uni app写项目,发现H5软键盘弹起,导致我固定定位的按钮被顶了上去,如图二.解决方法 1.让其在输入框获取焦点时隐藏百度了许多,有让输入框获取焦点时让按钮隐藏的方法,失去 ...
axios封装，api接口封装统一管理
axios封装,api接口封装统一管理一. axios说明 Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中. axios的封装和api接口的统一管理, ...
python写的小程序怎么封装_Promise实现微信小程序接口封装过程
Promise实现微信小程序接口封装过程发布时间:2020-06-15 13:40:43 来源:亿速云阅读:419 作者:鸽子相信很多开发者都遇到过回调地狱的问题.由于微信小程序的API基本都是 ...

Uni-app fly 接口封装

Uni-app fly 接口封装相关推荐

最新文章

热门文章