Vue条带元素的createPaymentMethod在Laravel中不起作用，TypeError：Object（...）不会发生函数错误

Question

Stripe的createPaymentMethod在Laravel和Vue Stripe元素中不起作用。这是我的代码

import { Card, createToken, createPaymentMethod } from 'vue-stripe-elements-plus';

components : {
    stripeCard : Card
},

methods : {
    pay() {
        createToken({
            name : this.name,
            street_line1 : this.street,
            street_country : this.selectedCountry,
            street_zip : this.postalCode
        })
        .then((data) => {
            createPaymentMethod('card', {
                card: data.token.card.id, // token from createToken (without any params)
                billing_details: {
                    name: this.name, // cardholder name
                    email: this.email,
                    address: { // address fetched from algolia places
                        line1: this.street,
                        country: this.selectedCountry,
                        city: this.city,
                        postal_code: this.postalCode,
                    },
                }
            }) 
        })
    }
}

但显示错误TypeError: Object(...) is not a function我不知道我的问题在哪里。任何帮助将是可观的。预先感谢。

我正在使用这个包裹https://www.npmjs.com/package/vue-stripe-elements-plus

Answer 1

无需同时创建付款方式和令牌。您可以将PaymentMethods API视为令牌API（1）的较新版本。因此，您可以将代码简化为：

  methods : {
    pay() {
      createPaymentMethod('card', {
        billing_details: {
          name: this.name, // cardholder name
          email: this.email,
          address: { // address fetched from algolia places
            line1: this.street,
            country: this.selectedCountry,
            city: this.city,
            postal_code: this.postalCode,
          },
        }
      }) 
    }
  }

**，我完全删除了card: data.token.card.id行。这应该是不必要的，因为您正在使用的库会自动为您添加对Card元素的引用，如下所示：

https://github.com/fromAtoB/vue-stripe-elements/blob/ede16058193e2440dfd5a7cb7af17450d52e234b/src/stripeElements.js#L68

（（1）https://stripe.com/docs/payments/payment-methods