ref="uniPay" 改成 ref="pay" 兼容vue3

pages/index/index.vue

@@ -87,8 +87,8 @@
 		<!-- #ifdef H5 -->
 		<button v-if="h5Env === 'h5-weixin'" @click="getWeiXinJsCode('snsapi_base')">公众号获取openid示例</button>
 		<!-- #endif -->
-		<!-- 统一支付组件 -->
-		<uni-pay ref="uniPay" :adpid="adpid" height="70vh" return-url="/pages/order-detail/order-detail" logo="/static/logo.png" @success="onSuccess" @create="onCreate" @fail="onFail"></uni-pay>
+		<!-- 统一支付组件，注意：vue3下ref不可以等于组件名，因此这里ref="pay" 而不能是 ref="uniPay" -->
+		<uni-pay ref="pay" :adpid="adpid" height="70vh" return-url="/pages/order-detail/order-detail" logo="/static/logo.png" @success="onSuccess" @create="onCreate" @fail="onFail"></uni-pay>
 	</view>
 </template>
 
@@ -151,7 +151,7 @@
 				this.order_no = `test`+Date.now();
 				this.out_trade_no = `${this.order_no}-1`;
 				// 打开支付收银台
-				this.$refs.uniPay.open({
+				this.$refs.pay.open({
 					total_fee: this.total_fee, // 支付金额，单位分 100 = 1元
 					order_no: this.order_no, // 业务系统订单号（即你自己业务系统的订单表的订单号）
 					out_trade_no: this.out_trade_no, // 插件支付单号
@@ -170,7 +170,7 @@
 				this.order_no = `test`+Date.now();
 				this.out_trade_no = `${this.order_no}-1`;
 				// 发起支付
-				this.$refs.uniPay.createOrder({
+				this.$refs.pay.createOrder({
 					provider: provider, // 支付供应商
 					total_fee: this.total_fee, // 支付金额，单位分 100 = 1元
 					order_no: this.order_no, // 业务系统订单号（即你自己业务系统的订单表的订单号）
@@ -190,7 +190,7 @@
 				this.order_no = `test`+Date.now();
 				this.out_trade_no = `${this.order_no}-1`;
 				// 发起支付
-				this.$refs.uniPay.createOrder({
+				this.$refs.pay.createOrder({
 					provider: provider, // 支付供应商
 					total_fee: this.total_fee, // 支付金额，单位分 100 = 1元
 					order_no: this.order_no, // 业务系统订单号（即你自己业务系统的订单表的订单号）
@@ -236,7 +236,7 @@
 			// 查询支付状态
 			async getOrder() {
 				this.getOrderRes = {};
-				let res = await this.$refs.uniPay.getOrder({
+				let res = await this.$refs.pay.getOrder({
 					//out_trade_no: this.out_trade_no, // 插件支付单号 两者传1个即可
 					transaction_id: this.transaction_id, // 第三方单号 两者传1个即可
 					await_notify: true
@@ -258,7 +258,7 @@
 			},
 			// 发起退款
 			async refund() {
-				let res = await this.$refs.uniPay.refund({
+				let res = await this.$refs.pay.refund({
 					out_trade_no: this.out_trade_no, // 插件支付单号
 				});
 				if (res) {
@@ -270,7 +270,7 @@
 			},
 			// 查询退款状态
 			async getRefund() {
-				let res = await this.$refs.uniPay.getRefund({
+				let res = await this.$refs.pay.getRefund({
 					out_trade_no: this.out_trade_no, // 插件支付单号
 				});
 				if (res) {
@@ -282,7 +282,7 @@
 			},
 			// 关闭订单
 			async closeOrder() {
-				let res = await this.$refs.uniPay.closeOrder({
+				let res = await this.$refs.pay.closeOrder({
 					out_trade_no: this.out_trade_no, // 插件支付单号
 				});
 				if (res) {
@@ -294,7 +294,7 @@
 			},
 			// 获取公众号code
 			async getWeiXinJsCode(scope="snsapi_base") {
-				let res = await this.$refs.uniPay.getProviderAppId({
+				let res = await this.$refs.pay.getProviderAppId({
 					provider: "wxpay",
 					provider_pay_type: "jsapi"
 				});
@@ -307,7 +307,7 @@
 			},
 			// 获取公众号openid
 			async getOpenid(data={}) {
-				let res = await this.$refs.uniPay.getOpenid(data);
+				let res = await this.$refs.pay.getOpenid(data);
 				if (res) {
 					this.openid = res.openid;
 					// 将openid缓存到本地