vue.js-Vue Stripe 结帐错误“TypeError：this.$refs.checkoutRef.redirectToCheckout 不是函数”

我正在测试 Vue Stripe Checkout：https ://docs.vuestripe.com/vue-stripe/stripe-checkout/one-time-payment 我在控制台中收到此错误：[Vue warn]: Error in v-在处理程序上：“TypeError：this.$refs.checkoutRef.redirectToCheckout 不是一个函数”，这是代码（我正在使用产品 y 测试密钥），已经启用了结帐客户端集成，我正在 localhost 中对其进行测试，条纹文档在测试模式下说适用于任何域：

<template>
  <div>
    <stripe-checkout
      ref="checkoutRef"
      mode="payment"
      :pk="publishableKey"
      :line-items="lineItems"
      :success-url="successURL"
      :cancel-url="cancelURL"
      @loading="v => loading = v"
    />
    <button @click="submit">Pay now!</button>
  </div>
</template>

<script>
import { StripeCheckout } from '@vue-stripe/vue-stripe';
export default {
  components: {
    StripeCheckout,
  },
  data () {
    this.publishableKey = process.env.STRIPE_PUBLISHABLE_KEY;
    return {
      loading: false,
      lineItems: [
        {
          price: 'some-price-id', // The id of the one-time price you created in your Stripe dashboard
          quantity: 1,
        },
      ],
      successURL: 'your-success-url',
      cancelURL: 'your-cancel-url',
    };
  },
  methods: {
    submit () {
      // You will be redirected to Stripe's secure checkout page
      this.$refs.checkoutRef.redirectToCheckout();
    },
  },
};
</script>