mikeko0901-modal | Stripe Developers | Page 1

fiery pendant Sep 15, 2021, 12:57 AM

#

@maiden saffron we're going to need a lot more details but right now it means you are trying to mount the card element in a div with the id card-element and that div does not exist yet at the time the JS code is running

#

my guess is that you add this div when you render the modal but you run the JS code on page load

#

you need to mount the element once the modal is rendered instead

#

@maiden saffron here

maiden saffron Sep 15, 2021, 1:05 AM

#

this is my code

📎 vuecode.txt

#

★this is ErrorMessage

[Vue warn]: Error in nextTick: "IntegrationError: The selector you specified (#card-element) applies to no DOM elements that are currently on the page.
Make sure the element exists on the page before calling mount()."

found in

---> <StripeCard>

IntegrationError: The selector you specified (#card-element) applies to no DOM elements that are currently on the page.
Make sure the element exists on the page before calling mount().

fiery pendant Sep 15, 2021, 1:08 AM

#

did you see my explanation above though?

#

I explain what's going on and what the issue likely is. I don't know much about Vue, but your code is running in JS before the element exists or before it is "visible/accessible" in JS

#

what does this.$nextTick(() => { this.stripeCard.mount('#card-element'); }); mean?

#mikeko0901-modal