标签: react-stripe-elements

嗨，我在我的反应项目中使用条纹。我需要显示用户保存的卡片。是否有任何条纹组件可以向用户显示保存的卡片详细信息。？

TIA

Stripe具有react-stripe-elements，提供injectStripeHOC。我们现在在2019年，而HOC不再酷了。Stripe似乎并不着急，我认为这是因为他们想支持React的较早版本，因此只关注最低的公分母解决方案。

我正在寻找一种stripe通过钩子获取的方法（而不是由提供的道具injectStripe）。

用法看起来像这样， const stripe = useStripe() 以便以后可以使用stripe.handleCardSetup和其他API方法

import { CardElement } from 'react-stripe-elements'

const CardForm = ({secret}) => {
  const stripe = useStripe()

  const handleSubmit = async () => {
    const { setupIntent, error } = await stripe.handleCardSetup(secret)
    // ...
  }

  return (
    <>
      <CardElement />
      <button onClick={handleSubmit} />
    </>
  )
}

您如何定义useStripe现有API和组件的钩子？ stripe应该与您使用injectStripe钩子时得到的相同

GH上的相关问题：API评论：Hooks＆Beyond

我正在努力让 Stripe 在我的服务器上工作。

所以，在客户端，我有这个代码（在努力让元素工作之后）：

this.props.stripe.createPaymentMethod({ type: 'card', card: cardElement, billing_details: { name: name } }).then((paymentMethod) => {
        // server request with customer_id and paymentMethod.id);
      });

这工作正常。现在，在服务器 (NodeJS) 上，我想为我的客户添加一个固定费用的新订阅。

这是我所拥有的：

const paymentIntent = await stripe.paymentIntents.create({
          amount: 1000,
          currency: 'usd',
          payment_method_types: ['card'],
          customer: req.body.customer_id,
          metadata: { integration_check: 'accept_a_payment' },
        });

const paymentIntentConfirmation = await stripe.paymentIntents.confirm(paymentIntent.id, { payment_method: req.body.paymentMethod_id });


const newSubscription = await stripe.subscriptions.create({
          customer: req.body.customer_id,
          items: [{ plan: premium_plan.id, quantity: 1 }],
          default_payment_method: req.body.paymentMethod_id,
        });
const attachPaymentToCustomer = await stripe.paymentMethods.attach(req.body.paymentMethod_id, { …

我想使用react-stripe-elements提供的安全性和功能，但在react-credit-cards 组件中输入数据时显示它。为此，我需要访问这些字段将具有的值。所以它看起来像这样：

如何访问在 CardNumberElement、CardExpiryElement、CardCVCElement 等中输入的值以在可视组件中显示它们？

这可能吗？提前谢谢。