uniApp的支付与打包

支付app的支付(支付宝付)

准备工作

1、支付厂商获取id

获取支付厂商 uni.getProvider({
   service:"payment"})

2、微信:微信支付平台https://pay.weixin.qq.com/
在这里插入图片描述

3、打包 manifest.json app模块配置 payment支付
可以选择支付宝支付或者其他平台的支付
在这里插入图片描述

具体支付代码

用户发起支付 requestPayment(item,index){
   }
获取订单信息 getOrderInfo(item.id)
  发起支付api 
uni.requestPayment({
   
provider:item.id,//提供商
orderInfo:orderInfo,//订单信息
})

html部分

<template>
	<view>
		<view class="title">支付</view>
		<view>
			支付金额:<input :value="price" maxlength="4" @input="priceChange" placeholder="请求输入支付金额" />
			<view>
				<button size="mini" type="primary" v-for="(item,index) in providerList" :key="item.id" :loading="item.loading"  @click="requestPayment(item,index)">{
   {
   item.name}}支付</button>
			</view>
		</view>
	</view>
</template>

js部分

export default {
   
		data() {
   
			return {
   
				price:1,
				providerList: [], //支付厂商,微信,或者支付
				openid:'' //用户id
			}
		},
		onLoad(){
   
			var that  = this;
			// 获取支付厂商
			uni.getProvider({
   
				service: "payment",
				success: (e) => {
   
					console.log(JSON.stringify(e))
					var provider = e.provider;
					// 映射一个格式(添加loading是否加载中)
					that.providerList = provider.map(item=>{
   
						if(item==="alipay"){
   
							return {
   
								name: '支付宝',
								id: item,
								loading: false
							}
						}else if(item==="wxpay"){
   
							return {
   
								name: '微信',
								id: item,
								loading: false
							}
						}
					})
				}
			})
		},

methods

	// 实现支付
			async  requestPayment(item,index){
   
				// 显示加载中
				item.loading = true</
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值