小编Fio*_*lar的帖子

我正在使用“Vue Stripe Checkout 3”组件，当我尝试实现它时，出现以下错误“

Invalid value for Stripe (): apiKey should be a string. You specified: undefined.

在我的数据中我有：

publishableKey: process.env.PUBLISHABLE_KEY,

我还尝试直接添加我的密钥（publishableKey：'我的密钥'），但它仍然不起作用。我也尝试过直接把它放在道具上，但什么也没有。

<template>
<div>
          <stripe-checkout 
          ref="checkoutRef" 
          :pk="publishableKey"
          :items="items"
          :successUrl="successUrl"
          :cancelUrl="cancelUrl">

    <template slot="checkout-button">
      <button @click="checkout" class="btn-yellow wow fadeInUp btn" style="visibility: visible; animation-name: fadeInUp;">Pagar</button>
    </template>
  </stripe-checkout>
       
</div>
</template>

<script>
import { StripeCheckout } from 'vue-stripe-checkout';

export default {
   components: {
    StripeCheckout
  },
   data: () => ({
    loading: false,
publishableKey: 'sk_test_51H85e2F5x69G5dDPxFEtO0RyIBWBEWkqwV9fpN5ovLysfCxJ15kfyeALoUFdZNi57yt0zj40h4LV3l5Zkra6WPCw00by0N0W3a',
    items: [
      {
        sku: item.sku, 
        quantity: 1
      }
    ],
    successUrl: 'https://tarfut.es',
    cancelUrl: 'https://tarfut.es', …

在这个版本的@ionic/vue@0.5.5.2 中，我无法使用组件并为其分配引用（< Login ref="modal"/>）以在 Modal 组件 (Login.vue) 中关闭它，因此我不知道如何从 Login.vue 关闭它。我留下我的代码：

主页.vue

<template>
<ion-page>
    <ion-header>
        <ion-toolbar>
            <ion-title>
                Title
            </ion-title>
        </ion-toolbar>
    </ion-header>

    <ion-content class="auth-form">

        <ion-grid>
            <ion-row>
                <ion-col align-self-center>
                    <ion-button @click="openModal" expand="block" color="primary">Registrarme</ion-button>

                    <span class="divider line one-line">o</span>

                    <span class="already">¿Tienes una cuenta?</span>

                    <ion-button @click="openModal" expand="block" color="danger">Iniciar sesión</ion-button>
                </ion-col>
            </ion-row>
        </ion-grid>
       
    </ion-content>

</ion-page>
</template>

<script>
import {
    IonContent,
    modalController,
    IonTitle,
    IonToolbar,
    IonHeader,
    IonButton,
    IonCol,
    IonRow,
    IonGrid,
    IonPage
} from '@ionic/vue';
import Login from '../views/Login.vue';

export default {
    name: 'inicio',
    components: {
       
        IonContent,
        IonTitle,
        IonToolbar,
        IonHeader, …