#jin_api
quiet knollBOT
👋 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/1308969328141406279
📝 Have more to share? Add more details, code, screenshots, videos, etc. below.
sinful trout
Can you try
const appearance = { /* appearance */ };
const options = { mode: 'shipping' };
const elements = stripe.elements({ clientSecret, appearance });
from: https://docs.stripe.com/elements/address-element?platform=web#create-an-address-element ?
quartz dagger
I'm thinking about doing it in React so I did <AddressElement options={{ mode: 'billing', appearance: APPEARANCE }} />
and got this
Let me get you the package versions.
@stripe/stripe-js@2.4.0
@stripe/react-stripe-js@2.4.0
sinful trout
Could you share your full initialization code ?
quartz dagger
Do you mean including the APPEARANCE I passed in or the useElement part?
sinful trout
Yes, okie but before that can you see this code example: https://docs.stripe.com/elements/address-element/collect-addresses?platform=web&client=react#add-and-configure-the-elements-provider-to-your-page
import React from 'react';
import ReactDOM from 'react-dom';
import {Elements} from '@stripe/react-stripe-js';
import {loadStripe} from '@stripe/stripe-js';
import AddressForm from './AddressForm';
// Make sure to call `loadStripe` outside of a component’s render to avoid
// recreating the `Stripe` object on every render.
const stripe = loadStripe('pk_test_xxx');
function App() {
const options = {
// Fully customizable with appearance API.
appearance: {/*...*/},
};
return (
<Elements stripe={stripe} options={options}>
<AddressForm />
</Elements>
);
};
ReactDOM.render(<App />, document.getElementById('root'));
