ReactJS - 如何将数据发送到 PayPal 按钮？

Question

这可能很简单，但是如何将信息发送到 PayPal 按钮组件？ 比如产品名称、总价值？

这就是我所做的，我测试了我的代码并获得了“交易成功”：

// In panierPage, where the user can click on the PayPal button
import PayPal from '../services/PayPal/paypal'

    return (
                <Grid style={{marginLeft: '2%'}}>
                    <PayPal/>
                </Grid>
        );

// PayPal Button component with "default value " for testing
import React, { useEffect, useRef } from 'react';

export default function Paypal() {

    const paypal = useRef()

    useEffect(() => {
        window.paypal.Buttons({
            style: {
                color: 'gold',
            },
            createOrder: (data, actions) => {
                return actions.order.create({
                    intent: 'CAPTURE',
                    purchase_units: [
                        {
                            description: 'Une table',
                            amount: {
                                currency_code: 'EUR',
                                value: '10.00'
                            }
                        }]
                })
            },
            onApprove: (data, actions) => {
                console.log("Transaction Réussite")
                return actions.order.capture();
            },
            onCancel: (data, actions) => {
                
            }
        }).render(paypal.current)
    }, [])

    return (
        <div>
            <div ref={paypal}></div>
        </div>
    );
}

因为现在是硬编码的价格和描述。

感谢您的时间和帮助！

Answer 1

您将硬编码的值替换为动态设置的值。使用变量，调用document.getElementById 之类的函数，或者您自己的生成项目列表数组的自定义函数，或者您希望执行的任何操作来获取必要的值；它是 JavaScript。

结果只需要在运行时评估为有效的 v2 Orders 请求对象。该对象的完整语法记录在这里：https://developer.paypal.com/docs/api/orders/v2/#orders-create-request-body