原生小程序,使用Promise简化接口

Promise是异步编程的一种解决方案,比传统的解决方案--回调函数和事件--更强大。

而且通过ES6的Promise对象,可以将嵌套的异步操作,改为线性的展现形式,在逻辑上更为清晰。

小程序的框架,如wepy框架,可以安装配置Promise,可以将所有的异步API  Promise化,也就是说所有的异步API都可以使用Promise写法;而原生小程序内部已经引入了Promise,在开发工具中可以直接使用。

在小程序开发中,肯定会涉及到数据请求,调用wx.request()方法一次两次还好,一旦请求次数多了,在代码量上就会表现出很多,而且逻辑不清晰,不方便管理,所以使用Promise来改写原生小程序的提供的API

wx.request的改写

//  promisify.js
const baseUrl='https://xxx';    // 域名
const request=(url,params={})=>{
    return new Promise((resolved,reject)=>{
        wx.request({
            url:baseUrl+url,
            method:params.method || 'POST',
            data:params.query || {},
            header:params.header || {'content-type':'application/x-www-form-urlencoded'},
            success:res=>resolved(res),
            fail:res=>reject(res)
        })
    })
}
module.exports={ request }

OK 现在已经将wx.request改写成Promise形式了,然后页面引入就可以使用了

// 使用的页面
let promisify=require('promisify.js的路径');
promisify.request('url',{query:{id:id,...}}).then(res=>{ console.log(res) })

这只将wx.request这个接口进行了Promise化,其他的异步API还是不能用Promise写法,这种情况只能一个一个的去改写接口。

可以看到小程序的API接口形式都是统一的,即 wx.function_name(obj),所以可以将所有的小程序接口统一改写

const newApi=(name,params={})=>{
    return new Promise((resolved,reject)=>{
        wx[name]({
            ...params,
            success:res=>resolved(res),
            fail:res=>reject(res)
        })
    })
}
module.exports={ newApi }

页面引入之后就可以使用,且小程序的异步API都可以使用Promise写法

let promisify = require('promisify.js路径');
// 显示隐藏loading
promisify.newApi('getSystemInfo').then(res=>console.log(res))

 

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值