Vue Stripe Checkout，演示代码问题

Question

I am trying to use and implement Vue-Stripe-Checkout , however I came across an issue in the very beginning with the demo code - at the very beginning when using the Vue Stripe Elements from over here. I was wondering if someone knows what the issue is? It doesn't produce an error, but it simply doesn't work when the details are filled and the button is clicked.

The token function works, however the button click does not work, which is shown below

<StripeElements
                :pk="publishableKey"
                :amount="amount"
                locale="auto"
                @token="tokenCreated"
                @loading="loading = $event"
                ref="elementsRef"
            >
            </StripeElements>
            <v-btn color="primary" @click="submit">Pay ${{amount / 100}}</v-btn>

this.$refs.elementsRef.submit();

Sandbox Example:https://codesandbox.io/s/purple-firefly-ovj4r?file=/src/App.vue

Thank you!

Answer 1

It looks like you just need to supply your publishable key in pk : https://codesandbox.io/s/adoring-browser-qs7c4?file=/src/App.vue