简单的微信支付功能实现~

项目需求做一个微信支付功能，只需要个input固定支付100块就行。
我用的是uni-app框架
微信支付文档地址
https://pay.weixin.qq.com/wiki/doc/api/wxa/wxa_api.php?chapter=7_7&index=5
代码：

	<input class="rechInput" @input="rechInput" type="number" v-model="rech" :value="rech" placeholder="" disabled="disabled">￥
	<button class="btn" v-if="this.payCode == 200" style="background: #ccc;font-size: 15px;">已支付</button>
	<button class="btn" v-else @click="btn">支付</button>

一个input两个button

		btn: function(e) {
				let evnsandBox = this.evnsandBox//evnsandBox为微信支付测试环境，默认false
				let dataJson = {
					total: this.rech,
					pay_project_code: this.userList.all_code[0],
					pay_project_name: '智慧校园增值收费',
				}
				uni.request({
					url: this.$httpUrl + "/wechat/requestPayPost",
					method: "POST",
					data: dataJson,
					header: {
						'X-Requested-With': 'XMLHttpRequest',
						'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8',
						'h-school': 'rx'
					},
					success: (res) => {
						console.log(res);
						if (res.data.code == '200') {
							console.log(evnsandBox);
							if (evnsandBox == true) { //为true是表示为支付测试环境
								uni.showToast({
									title: '支付成功',
									icon: "none"
								})
								uni.reLaunch({
									url: "../home/home"
								})
							} else {  //正式支付环境
								if (typeof WeixinJSBridge == "undefined") {
									alert("js api 异常");
								} else {
									var data = {
										"appId": res.data.data.pay_data.appId, //公众号名称，由商户传入
										"timeStamp": res.data.data.pay_data.timeStamp, //时间戳，自1970年以来的秒数
										"nonceStr": res.data.data.pay_data.nonceStr, //随机串
										"package": res.data.data.pay_data.packageValue,
										"signType": res.data.data.pay_data.signType, //微信签名方式：
										"paySign": res.data.data.pay_data.paySign //微信签名
									}
									WeixinJSBridge.invoke(
										'getBrandWCPayRequest',
										data,
										function(res) {
											console.log(res);
											if (res.err_msg == "get_brand_wcpay_request:ok") {

												uni.showToast({
													title: '支付成功',
													icon: "none"
												})
												uni.reLaunch({
													url: "../home/home"
												})
											} else {
												uni.showToast({
													title: '支付失败',
													icon: "none"
												})
											}
											// 使用以上方式判断前端返回,微信团队郑重提示：res.err_msg将在用户支付成功后返回    ok，但并不保证它绝对可靠。   
										}
									);
								}
							}

						} else {
							uni.showToast({
								title: '支付失败',
								icon: "none"
							})
							uni.reLaunch({
								url: "../home/home"
							})
						}

					},
					fail: (err) => {
						uni.showToast({
							title: "接口请求失败"
						})
					}
				})
			},

效果图：

成功调启支付接口。