微信小程序api怎么promise化

微信小程序api怎么promise化,第1张

默认情况下,小程序官方提供的异步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 '文件路径'


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/yw/12353694.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-24
下一篇 2023-05-24

发表评论

登录后才能评论

评论列表(0条)

保存