Vue-Stripe: this.$refs.checkoutRef.redirectToCheckout(); не является функцией. В старой версии npm

Question

В настоящее время я обновляю старый веб-сайт, и мне нужно включить Stripe для оформления заказа. Когда я перехожу к кассе, я получаю сообщение об ошибке «this.$refs.checkoutRef.redirectToCheckout не является функцией».

Я тестировал Checkout в другом тестовом проекте, и он работал нормально. Я считаю, что ошибка связана со старой версией npm, потому что это единственная разница между моими проектами. Я использую npm версии 14.18.1 и установил vue-stripe 4.4.4.

Ниже приведен фрагмент кода.

      <template>

.
.
.

  <stripe-checkout
      ref="checkoutRef"
      mode="payment"
      :pk="publishableKey"
      :line-items="lineItems"
      :success-url="successURL"
      :cancel-url="cancelURL"
      @loading="v =>loading = v"
  />
<button class="btn btn-danger unpaid" @click="checkout">Checkout</button>

.
.
.

</template>

<script>
  import axios from "axios"; //This is irrelevant for the Checkout
  import qs from 'query-string'; //This is irrelevant for the Checkout
  import {StripeCheckout} from '@vue-stripe/vue-stripe';

  export default {
    components: {
      StripeCheckout,
    },

name: 'MeineRechnungen',
data() {
this.publishableKey = process.env.VUE_APP_STRIPE_PUBLISHABLE_KEY;
  return{
    loading: false,
    lineItems: [
      {
        price: process.env.VUE_APP_STRIPE_PRODUCT_STANDARD,
        quantity: 1,
      },
    ],
    successURL: 'https:xxxxx.com', //I censored the URL for this question
    cancelURL: 'https:xxxxx.com', //I censored the URL for this question
    invoices: '' //This is irrelevant for the Checkout 
    }
},
methods: {
    checkout() {
      this.$refs.checkoutRef.redirectToCheckout();
    },

.
.
.

</script>

Answer 1

Я не уверен, почему это не сработает, поскольку следует задокументированному примеру , но вам следует связаться сvue-stripeразработчика для руководства по этому вопросу.

Если вы собираетесь использовать один и тот же фиксированный продукт для нескольких сеансов оформления заказа, вам следует вместо этого создать ссылку для оплаты для этого продукта/цены. Это даст вам многоразовый простой платежurlвы можете отправлять своих клиентов, что автоматически создает для них сеанс Checkout.