Ошибка "Stripe is notfined" - вызов функции перед загрузкой скрипта? - PullRequest
Новая
       19

Ошибка "Stripe is notfined" - вызов функции перед загрузкой скрипта?

1 голос
/ 24 мая 2019

Я думаю, что у меня проблема со скриптом, который не загружается (или загружается слишком рано).

Я пытаюсь реализовать библиотеку Stripe для пиимента.Для этого я должен включить скрипт перед использованием функций Stripe в моем коде.Я добавил данный скрипт src = "https://js.stripe.com/v3/", в мою общую папку, в index.html в заголовке следующим образом: 

<html lang="en">
  <head>
    <meta charset="utf-8" />
    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="theme-color" content="#000000" />
    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
    <script src="https://js.stripe.com/v3/"></script>
    <title>React App</title>
  </head>
  <body>
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <div id="root"></div>
  </body>
</html>

Я создал пустое приложение, только с вызовом Stripe. Вот приложение.js: 

import React from 'react';
import './App.css';
import {Button} from 'react-bootstrap'

class App extends React.Component {
  constructor() {
    super();
    this.handleClick = this.handleClick.bind(this);
  }

  handleClick(){
    var stripe = Stripe('pk_test_XXXXXXXXXXXX');
    // I will use stripe variable later. But for now I have an error with previous line
  }

  render() {
    return(
      <div>
          <Button 
                  className= "btn-xlBook"
                  variant="primary"
                  onClick={this.handleClick}>
                  OK
          </Button>
      </div>
    )
  }

}
export default App

Но когда я запускаю пряжу, у меня появляется ошибка 'Stripe' не определен no-undef .

Не знаюПонимаю, я вызываю скрипт в заголовке, но поведение такое, как будто скрипт еще не загружен.

Знаете, как его решить? Я добавляю скрипт в заголовок index.html,оно должно загружаться перед приложением, не так ли?

Ответы [ 2 ]

1 голос
/ 24 мая 2019

Вместо этого используйте пакет полос npm и импортируйте его. Добавьте оператор импорта и используйте обертку в вашем index.js 

import {StripeProvider} from 'react-stripe-elements';


<StripeProvider apiKey="pk_test_12345">
      <MyStoreCheckout />
 </StripeProvider>

и затем в вашей консоли установите пакет: 

npm install --save react-stripe-elements

или 

yarn add react-stripe-elements
1 голос
/ 24 мая 2019

Вы нигде не импортируете Stripe.Как вы делаете с Button например.Посмотрите React Stripe Elements , чтобы узнать, как использовать Stripe в React.

...