确认页面未显示在 React 的 Google 支付集成中

Question

我正在使用 @google-pay/button-react 这个包来实现 Google 支付按钮，但是当我点击“继续”按钮时弹出关闭。我需要显示带有电子邮件等的价格确认页面。这是我的代码，请让我知道我做错了什么这是我的代码：

<GooglePayButton
    environment="TEST"
    paymentRequest={{
        apiVersion: 2,
        apiVersionMinor: 0,
        allowedPaymentMethods: [
            {
                type: 'CARD',
                parameters: {
                    allowedAuthMethods: ['PAN_ONLY', 'CRYPTOGRAM_3DS'],
                    allowedCardNetworks: ['MASTERCARD', 'VISA'],
                },
                tokenizationSpecification: {
                    type: 'PAYMENT_GATEWAY',
                    parameters: {
                        gateway: "moneris",
                        gatewayMerchantId: "monca05217"
                    },
                },
            },
        ],
        merchantInfo: {
            merchantId: '12345678901234567890',
            merchantName: 'Demo Merchant',
        },
        transactionInfo: {
            totalPriceStatus: 'FINAL',
            totalPriceLabel: 'Total',
            totalPrice: '50.00',
            currencyCode: 'USD',
            countryCode: 'US',
        },
    }}
    onLoadPaymentData={paymentRequest => {
        console.log('load payment data', paymentRequest);
        props.cardDetail(paymentRequest,endDate);                                        
    }}                                    
    />

Answer 1

我不确定我是否理解您要执行的操作，但预期的行为是在您单击“继续”后关闭付款表。

如果您希望 Google Pay 显示总价，您可以通过处理付款授权回调来实现此目的的一种方法：

1. 将callbackIntents: ['PAYMENT_AUTHORIZATION']添加到paymentRequest，
2. 实现onPaymentAuthorized回调。

如果您想要用户的电子邮件，请将emailRequired: true 添加到paymentRequest。

示例 (https://jsfiddle.net/h1w5c0vk/)：

<GooglePayButton
    paymentRequest={{
        // ...
        callbackIntents: ['PAYMENT_AUTHORIZATION'],
        emailRequired: true,
    }}
    onPaymentAuthorized={() => ({ transactionState: 'SUCCESS' })}
    />