vuejs laravel stripe checkout.js payment

payment.vue

<template>
  <div>
  <div ref="card"></div>


    <form action="/subscription" method="POST" id='myPaymentForm'>
            <input type="hidden" name="_token" :value="token">
        </form>

</div>
</template>

<script>
export default {
  data () {
            return {
                token: window.axios.defaults.headers.common['X-CSRF-TOKEN'],
            }
  },
  mounted: function () {
    var script = document.createElement('script');
        script.id = '_stripe-checkout-script';

        script.src = 'https://checkout.stripe.com/checkout.js';

var att = document.createAttribute("class");       // Create a "class" attribute
att.value = "stripe-button";                           // Set the value of the class attribute
script.setAttributeNode(att);

att = document.createAttribute("data-amount");       // Create a "class" attribute
att.value = "990";                           // Set the value of the class attribute
script.setAttributeNode(att);

att = document.createAttribute("data-name")
att.value="sueno Dev";
script.setAttributeNode(att);
att = document.createAttribute("data-currency")
att.value="gbp";
script.setAttributeNode(att);
att = document.createAttribute("data-key")
att.value=process.env.MIX_STRIPE_KEY;
script.setAttributeNode(att);
                    

        script.onload = this.setCheckout;
        document.getElementById('myPaymentForm').append(script);
  }
};
</script>