keelzebub_code | Stripe Developers | Page 1

subtle rockBOT Mar 17, 2025, 9:12 PM

#

👋 Welcome to your new thread!

⏲️ We'll be here soon! Typically we respond in a few minutes, but sometimes we might take a bit longer if the server is busy or if you have a particularly tricky question.

⏱️ We close idle threads, which makes them read-only. Once a thread is closed it won't be reopened, but you can always start a new thread if you have another question.

🔗 This thread will always be available, even after it's closed. You can find it again using Discord's search, or you can save this link: https://discord.com/channels/841573134531821608/1351302290702598154

📝 Have more to share? Add more details, code, screenshots, videos, etc. below.

#

subtle nest Mar 17, 2025, 9:16 PM

#

Hi there

dark island Mar 17, 2025, 9:17 PM

#

Hello!

subtle nest Mar 17, 2025, 9:18 PM

#

I think you can just use:
const { error, confirmationToken } = await stripePromise.createConfirmationToken({
elements,
});

dark island Mar 17, 2025, 9:21 PM

#

Sorry, my code might not be clear— elements is undefined in that example above; I don't know how to create a reference to the <Elements> component in the same component in which I'm using it

#

For example, I was thinking about doing:

      elements: elementsRef.current, 
    });```

And adding a ref to the component itself (`<Elements ref={elementsRef} />`), but that didn't seem to work

subtle nest Mar 17, 2025, 9:24 PM

#

Have you reviewed this example code? https://docs.stripe.com/payments/build-a-two-step-confirmation?client=react#create-ct

dark island Mar 17, 2025, 9:27 PM

#

I have—in that example, the <Elements /> component is in a parent component, with the call to stripe.createConfirmationToken in the child component.

I could potentially just create an extra wrapper parent component in which I instantiate <Elements>, I was just wondering if there's a way to avoid that and have both <Elements> and stripe.createConfirmationToken in the same component

subtle nest Mar 17, 2025, 9:37 PM

#

Give me a few minutes to loop in a teammate

frigid current Mar 17, 2025, 9:42 PM

#

Hi there! Let me take a look here and do some quick testing

frigid current Mar 17, 2025, 10:12 PM

#

The short answer is that you can't do this while using our React components; the components need to be rendered inside a component that is wrapped in the Elements provider. We discuss this, though not in great detail, in our documentation here: https://docs.stripe.com/sdks/stripejs-react#elements-provider

dark island Mar 17, 2025, 10:15 PM

#

Gotcha, thank you for your help!

#keelzebub_code