默认情况下,小程序官方提供的异步API都是基于回调函数实现的,这样就容易造成回调地狱的问题,代码的可读性、维护性差。API Promise化,指的是通过额外的配置,将官方提供的、基于回调函数的异步 API,升级改造为基于 Promise 的异步 API,从而提高代码的可读性、维护性,避免回调地狱的问题。实现API Promise化主要依赖于miniprogram-api-promise这个第三方的州戚 npm 包。首先需要确认已经正确安装了node,使用的开发工具为微信官方的微伍谨信开发者工具。
在项目文件夹下对项目进行初始化,执行npm init -y 此时项目文件夹下会创建package.json文件。 执行npm i --save miniprogram-api-promise安装第三方包。此时会在项目根目录下创建node_modules文件夹。 选择 工具-->构建npm 等待构建完成点击确定,此时会创建miniprogram_npm文件夹。在入口文件app.js中按需引入。
import {promisifyAll} from "miniprogram-api-promise"
const wxp=wx.p={}
promisifyAll(wx,wxp)
然后就可以通过wx.p来调用promise化的api。举个例子在test.js文件中
async getTestData(){
const {data:res}=await wx.p.request({methods:'册橘陵GET',url: 'https://xxx.xxx.xx', })
miniprogram-api-promise
前提是已经安装了node
安装前需液伏要初始化
此时在本地多出一个文件
执行命令,安装
安装完成,闹灶携会多出一个文件夹
构建完成多出辩蠢一个文件夹
Banner.js
Banner.wxml
一、在pages同级创建request文件夹 在此文件夹下创建一个index.js文件夹 在此文件夹内写入封装的api
const request = (method,url,params) =>{ // method (请求方式) url (请求的路径) params (请求的参数)
return new Promise((resolve,reject) =>{ // 创建一个promise函数
let baseUrl = "公共url"
uni.showLoading({ // 添加加载动画
title: '加载中'
})
uni.request({ // 发送请求
url: baseUrl + url, 正圆 // url 形参就是传入的地址
data: params? params:'', // 传入的请求参数
method: method, // 传入的请求方式
success: res =>{ // 成功的函数
resolve(res.data)
uni.hideLoading()
},
fail: err =>{ // 失败的函数
reject(err)
uni.hideLoading()
棚清颂 }
})
})
}
const api = {
get: (url,params) =>request("GET",url,params),
post: (url,params) =>request("POST",url,params)
}
export default api // 抛出接口
二、在request 文件目录下 创建一个 home文件夹 在home 文件夹内新建index.js文件
// 所有的首页的请求 ,都放在这里维护
import api from '../index.js'
export const get = params => api.get('路径',params) // get请求
export const post = params => api.post('路径',params) 链郑 // post请求
三、在所需要请求数据的页面内
import 请求名 from '文件路径'
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)