How to Accept Payments: Integrating Vue 2

I'm brand new to vue.js so any suggestions here would be appreciated. I'm following "How to Accept Payments: Integrating Vue 2" on Laravel 5.4. I think I have all the right packages/modules installed. I changed "this.$http" to "axios" as @max_veldink suggested in the comments for Laravel 5.4. Now my created() looks like..

created() {
        this.stripe = StripeCheckout.configure({
          key: Beswf.stripeKey,
          image: "https://stripe.com/img/documentation/checkout/marketplace.png",
          locale: "auto",
          token: function(token){
            this.stripeToken = token.id;
            this.stripeEmail = token.email;
            axios.post('/purchases', this.$data)
              .then( response => alert('Complete! Thanks for your purchase!') );
          }
        });
      },

The Strips form pops up, as expected. But, when I complete the Stripe form I get the green tick on the submit button but then I get this error in the browser console and no money is processed...

app.js:908 Uncaught (in promise) Error: Request failed with status code 500
at createError (app.js:908)
at settle (app.js:11663)
at XMLHttpRequest.handleLoad (app.js:747)

It looks to me like a problem with created(), in particular it's the axios.post which seems to be failing, so I guess it could be a problem with this.$data.

Any ideas?