#xignotic
desert ferry
raw gate
Yep, absolutely should work. Can you share your code?
What do you mean by 'clientSecret becomes undefined'?
inner knot
useEffect(() => {
const fetchClientSecret = async () => {
const data = await axios.get('/api/stripe').then(r => r.data)
setClientSecret(data.client_secret)
}
fetchClientSecret()
return () => {
}
}, [])``` <Tabs isLazy={true} index={activeStep}>
<TabPanels>
<Elements stripe={stripePromise} options={options} appearance={options.appearance}>
<form>
<TabPanel>
<DetailsTab/>
</TabPanel>
<TabPanel>
<PaymentDetailsTab/>
</TabPanel>
</form>
</Elements>
</TabPanels>
</Tabs>```Then in DetailsTab and PaymentDetailsTab I have the AddressElement and PaymentElement
So if I remove DetailsTab or PaymentDetails the client secret is defined but if I add the other it gives an error and it becomes undefined when I console log it
Specifically this error
raw gate
My guess is your code that initialises the Elements group is rendering before your effect to create the Payment Intent has run. You likely need to wrap a conditional around it to check if clientSecret is falsy
inner knot
Ah shoot, that's a little embarrassing
I have one last quesiton, is there any way to provide some type of summary page, with the users inputted data, before having the user proceed to payment?
raw gate
What kind of data exactly?
inner knot
I want to display the some address information such as email, name phone number and then a partial card number?
raw gate
Should be possible yes, but you're going to probably need to adjust your integration
inner knot
Do you know if I can do this through stripe or would I have to just listen to each input field?
inner knot
Thanks ynnoj, I appreciate it, have a nice day!
raw gate
Do you know if I can do this through stripe or would I have to just listen to ea...
You can get the address values: https://stripe.com/docs/js/elements_object/get_value_address_element
But for the payment details you'd need to inspect the Payment Method object that is created as a part of the flow I just shared
You can't get those from the Payment Element