useElement 钩子中的条纹刷新数据

Question

在表格付款中，用户可以选择更改高级帐户的期限（例如从 1 个月到 3 个月）。当用户更改它时，前面发送到 api 查询以再次创建 paymentIntents:

return await this.stripe.paymentIntents.create({
    amount: 2000 * months,
    currency: 'pln',
    payment_method_types: ['p24', 'card'],
    receipt_email: user.email,
    description: 'premium',
});

this.stripe.paymentIntentsreturn数据：

amount: 4000
client_secret: "pi_3KTDMNDbx0KEJcOR289fojfP_secret_Mh5jPfAKjvxpeZCuXmRcjilFL"
id: "pi_3KTDMNDbx0KEJcOR289fojfP"
...

问题出在 @stripe/react-stripe-js 库的钩子 useElements 上。在这个钩子里，我还有旧的 id，当我点击“支付”时，我有旧的金额，它是 2000，应该是 6000。

当用户更改月数时，如何刷新 useElements 中的数据？

PS：我正在使用这个 docs。 Select 'Custom payment flow' 在后端我有 Node (Nest.js)，在前面我有 React。

更新：

条纹支付方式：

import {
  PaymentElement,
  useStripe,
  useElements,
} from '@stripe/react-stripe-js'

const Stripe = () => {

    const stripe = useStripe()
    const elements = useElements()

    const sendPaymentDetails = async data => {
        if (!stripe || !elements) return
        setIsLoading(true)
        const { name, email } = data

        await stripe.confirmPayment({
            elements,
            confirmParams: {
                return_url: `${APPLICATION_URL}premium`,
                payment_method_data: {
                    billing_details: {
                        name,
                        email,
                    },
                },
            },
        })
    }

    return (
      <form onSubmit={sendPaymentDetails}>
        <PaymentElement />
      </form>
    )
}

这是创建 paymentIntent:

的方法

const [stripeOptions, setStripeOptions] = useState(null)

const paymentIntent = async months => {
  const { data } = await createPaymentIntent(months);
  setStripeOptions(data);
};

当我创建新的 paymentIntent 时，也应该更新 useElement 数据

Answer 1

我发现 resolve.I 应该更新 paymentIntents，而不是创建新的 paymentIntents。所以我添加方法：

return await this.stripe.paymentIntents.update(id, {
  amount: this.amount * months,
});

从这个docs

现在在 useElements 钩子里面我有正确的数据

useElement 钩子中的条纹刷新数据

Stripe refresh data in useElement hook

reactjs

react-hooks

stripe-payments