uniapp前端微信支付代码

1.支付按钮，定义支付事件

<u-button text="立即抢购" @click="payTap" shape="circle" color="#E10000">u-button>
1

2.支付事件

	// 这些参数根据后端需要什么就传什么，一般有用户id和订单号就行，推广员id和优惠卷id是我们小程序需要的
	let data = {
		openId: this.openId, // 用户id
		courseId: this.detailsObj.id, // 订单id
		promoterId: this.promoterShareId ? this.promoterShareId : '', // 推广员id （我的）
		receiveCouponId: this.detailsObj.receiveCouponId ? this.detailsObj.receiveCouponId : '' // 优惠卷id
	}
	// 创建订单接口，后端那边需要创建订单
	wxCreateOrder(data).then(res => {
		// 创建完成后返回真正的订单id
		// 下面接口是为了拿到订单密钥
		payment({
			orderNumber: res.data.orderId, // 真正的订单id
			openId: this.openId, //用户id
		}).then(res1 => {
			let twoData = res1.data.data
			console.log(twoData, '返回密钥')
			// 调用支付api
			// 下面是支付需要的参数，后端那里都能获取到
			uni.requestPayment({
				appId: twoData.appId, // 小程序的appid
				timeStamp:twoData.timeStamp ? (twoData.timeStamp).toString() : '',
				nonceStr: twoData.nonceStr,
				package: twoData.packageStr,
				signType: twoData.signType,
				paySign: twoData.paySign,
				success(result) {
					// 到这里就调出输入密码了
					console.log(result, '调起支付')
					if (result.errMsg == "requestPayment:ok") {
						//支付成功
						uni.showLoading({
							title: '获取订单状态..',
							mask: true,
						})
 						// 订单支付成功的回调，为了检查订单是否支付成功
						setOrderIsHaveData(_this.orderNum).then(data => {
							uni.hideLoading()
							// 成功了就刷新一下页面
							_this.requestDataAll()
						})
						_this.paySuccess()
					} else {
						uni.showModal({
							title: '',
							content: '支付失败',
							showCancel: false,
							icon: 'none',
							success(res) {}
						})
					}
				},
				fail(result) {
					console.log(result)
					uni.showModal({
						title: '',
						content: '支付失败',
						showCancel: false,
						icon: 'none',
						success(res) {}
					})
				},
			})
		})
	})
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65