matfish2 / vue-stripe

Vue.js 2 Stripe checkout component
https://www.npmjs.com/package/vue-stripe
MIT License
58 stars 18 forks source link

Iframe created many times #17

Closed sidbenac closed 7 years ago

sidbenac commented 7 years ago

When I instantiate the module in component I see that an Iframe is created by the stripe script,

everytime that I go out of the component by changing to an other route and get back there's an other Iframe created and so on, so it ends up creating many Iframes.

the bad thing is that by creating many Iframes, when I broadcast the result, it will be sent as many times as there are Iframes, so this is not good.

any idea ?

sidbenac commented 7 years ago

I figured out a way to deal with it,

actually when the component is mounted it was always injecting the Iframe when injectCheckoutScript was called, so I placed this code before that solved it

var frame = document.getElementsByName("stripe_checkout_app"); if (frame) { var i=0; while (frame[i]) { frame[i].parentNode.removeChild(frame[i]); } }

this fixes the problem

matfish2 commented 7 years ago

if you tell vue-router that the component can be reused (I believe this is the default) it won't call the mounted method every time you switch routes.