События onerror и onload не запускаются в элементе script в реакции - PullRequest
Новая
       1

События onerror и onload не запускаются в элементе script в реакции

0 голосов
/ 14 сентября 2018

Я пытаюсь извлечь скрипт из полосы динамически внутри моего компонента реакции. Получение сценария 

|script src="https://js.stripe.com/v3/">

тип способа работал. Однако в реакции кажется, что onerror и onload события просто не запускаются.

https://codesandbox.io/s/nn4kk55rr0

или 

import React, { Component } from "react";
import ReactDOM from "react-dom";

class App extends Component {
  showLoad = () => {
    console.log("loaded");
  };
  showError = () => {
    console.log("error");
  };
  fetchStripe = () => {
    console.log("fetching");
    var stripe = document.createElement("script");
    stripe.onload = this.showLoad;
    stripe.onerror = this.showError;
    stripe.src = "https://js.stripe.com/v3/";
  };
  componentDidMount() {
    this.fetchStripe();
  }
  render() {
    return <div className="App">Hallo</div>;
  }
}

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);

Спасибо за любую помощь заранее!

1 Ответ

0 голосов
/ 14 сентября 2018

Вам нужно добавить к <head>, чтобы начать загрузку, иначе он все еще находится в памяти, отсутствующей в DOM, поэтому браузер не будет анализировать его. Так что добавьте это также после строки stripe.src = "https://js.stripe.com/v3/";: 

document.getElementsByTagName('head')[0].appendChild(stripe);
...