微信小程序api接口调用用封装

1. 在 02-项目下新建request目录及index.js文件

1.1 02-项目\request\index.js

1.2.index.js


// 同时发送异步代码的次数
let ajaxTimes=0;
export const request=(params)=>{// 判断 url中是否带有 /my/ 请求的是私有的路径 带上header tokenlet header={...params.header};if(params.url.includes("/my/")){// 拼接header 带上tokenheader["Authorization"]=wx.getStorageSync("token");}ajaxTimes++;// 显示加载中 效果wx.showLoading({title: "加载中",mask: true});// 定义公共的urlconst baseUrl="https://api.zbztb.cn/api/public/v1";return new Promise((resolve,reject)=>{wx.request({...params,header:header,url:baseUrl+params.url,success:(result)=>{resolve(result.data.message);},fail:(err)=>{reject(err);},complete:()=>{ajaxTimes--;if(ajaxTimes===0){//  关闭正在等待的图标wx.hideLoading();}}});})
}

2.在项目中使用异步请求

02-项目代码\02-项目\pages\index

index.js

// 0 引入 用来发送请求的 方法 一定要把路径补全
import { request } from "../../request/index.js";
Page({data: {// 轮播图数组swiperList: [],// 导航 数组catesList:[],// 楼层数据floorList:[]},// 页面开始加载 就会触发onLoad: function (options) {// 1 发送异步请求获取轮播图数据  优化的手段可以通过es6的 promise来解决这个问题 // wx.request({//   url: 'https://api.zbztb.cn/api/public/v1/home/swiperdata',//   success: (result) => {//     this.setData({//       swiperList: result.data.message//     })//   }// });this.getSwiperList();this.getCateList();this.getFloorList();},// 获取轮播图数据getSwiperList(){request({ url: "/home/swiperdata" }).then(result => {this.setData({swiperList: result})})},// 获取 分类导航数据getCateList(){request({ url: "/home/catitems" }).then(result => {this.setData({catesList: result})})},// 获取 楼层数据getFloorList(){request({ url: "/home/floordata" }).then(result => {this.setData({floorList: result})})},
})

微信小程序api接口调用用封装相关推荐

微信小程序getWXACodeUnlimit接口调用和返回二进制流转换成图片保存到本地
微信小程序获取无限制带参数二维码后台接口请求处理第一步简单无坑GET请求把你的appid和appsecret拼接起来的URL会返回一个ACCESS_TOKEN public static Strin ...
wamp3.0.6配置https + Nginx转发 + 满足微信小程序的接口调用域名
环境:winserver2012 R2 wamp环境安卓无法发起请求https://www.jianshu.com/p/61695bfae5f7?utm_campaign 一. wamp3.0.6 ...
微信小程序开发——接口调用
利用前一篇 http_get 调用接口函数. wx.cloud.callFunction({name: 'http_get',data: {"options": {"m ...
小程序长按api_微信小程序API相关知识科普
微信小程序API(Application Programming Interface),即应用程序编程接口.API是一种接口函数,把函数封装起来,给开发者,这样好多的功能就不需要你去实现了,只要会调用 ...
微信小程序api调起微信提供的功能-网络、媒体、文件、数据存储、位置、设备、界面、开发接口
微信小程序-API 框架提供丰富的微信原生API,可以方便的调起微信提供的能力,如获取用户信息,本地存储,支付功能等. 说明: wx.on 开头的 API 是监听某个事件发生的API接口,接受一个 C ...
微信小程序上传接口php,微信小程序API 上传、下载
微信小程序API 上传.下载 wx.uploadFile(OBJECT) 将本地资源上传到开发者服务器.如页面通过 wx.chooseImage 等接口获取到一个本地资源的临时文件路径后,可通过此接口 ...
封装微信小程序api请求地址
封装微信小程序api请求地址 const API_BASE_URL = 'http://localhost:8080/test/api/'; module.exports = {IndexUrlNew ...
微信小程序接口文档PHP,微信小程序API 导航
微信小程序API 导航一.wx.navigateTo(OBJECT) 保留当前页面,跳转到应用内的某个页面,使用wx.navigateBack可以返回到原页面. OBJECT 参数说明: 示例代码: ...
PbootCMS微信小程序API的封装使用教程
PbootCMS微信小程序API的封装使用教程原文网址:https://www.lkcms.top/rgcms/58.html 第一步:准备md5加密文件 PbootCMS的签名参数signatur ...

微信小程序api接口调用用封装

微信小程序api接口调用用封装

2.在项目中使用异步请求

微信小程序api接口调用用封装相关推荐

最新文章

热门文章