小程序支付函数二次封装

你说啥？？？

于 2023-06-16 17:04:17 发布

阅读量244

点赞数

分类专栏：微信小程序文章标签：小程序微信小程序

本文链接：https://blog.youkuaiyun.com/kxmzl/article/details/131250039

版权

微信小程序专栏收录该内容

8 篇文章

订阅专栏

文章介绍了如何将微信小程序的支付函数wx.requestPayment进行封装，以简化代码复用。在utils文件夹下创建pay.js文件，定义了一个接受数据、成功回调和错误回调的函数，处理支付过程并显示支付成功或失败的提示。然后通过引入和调用这个封装后的函数实现支付功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

微信小程序支付函数wx.requestPayment(Object object) | 微信开放文档 (qq.com)

每次调用都需要写一遍

wx.requestPayment({
  timeStamp: '',
  nonceStr: '',
  package: '',
  signType: 'MD5',
  paySign: '',
  success (res) { },
  fail (res) { }
})

为了省事，将wx.requestPayment()进行了二次封装。

1.在utils文件夹（并非一定要在utils文件夹）下新建pay.js（可自定义文件名）文件

2.pay.js文件

const pay=(data, successData,errorData) => {
    wx.requestPayment({
      timeStamp: data.timeStamp,
      nonceStr: data.nonceStr,
      package: data.packageValue,
      signType: data.signType,
      paySign: data.paySign,
      success (res) {
        wx.showToast({
          title: "支付成功",
          icon: 'none',
          duration: 2000,
        }) 
        successData(data)     
       },
      fail (res) { 
        wx.showToast({
          title: "支付失败",
          icon: 'none',
          duration: 2000,
        })
        errorData(data)
      }
    })
}

//导出
module.exports = {
	pay: pay,
}

3.调用

//引入
const payment= require('@/utils/pay.js');

//使用
pay(data){
    payment.pay(data, res => {
          //这里是支付成功的回调
      },err=>{
          //这里是支付失败的回调函数
      })
}

链接：https://blog.youkuaiyun.com/m0_37938910/article/details/81092073