gpt4 book ai didi

javascript - 无法在 REACT 中创建新的 AdyenCheckout

转载 作者:行者123 更新时间:2023-12-01 00:51:29 26 4
gpt4 key购买 nike

我是 Adyen 新手,对 Javascript 和 REACT 也比较陌生。我尝试在 REACT 中使用 Adyen dropin 组件,但无法创建新的 AdyenCheckout 组件。

我使用以下代码在 componentDidMount 中加载了 Adyen Javascript:

const script = document.createElement("script");
script.src = "https://checkoutshopper-
test.adyen.com/checkoutshopper/sdk/3.0.0/adyen.js";
script.async = true;
document.body.appendChild(script);

我正在尝试使用以下代码创建 AdyenCheckout 组件:

const configuration = {
locale: "en_US",
environment: "test",
originKey: "YOUR_ORIGIN_KEY",
paymentMethodsResponse: this.state.paymentMethodsResponse,
};

const checkout = new AdyenCheckout(configuration);
const dropin = checkout
.create('dropin', {
onSubmit: (state, dropin) => {
},
onAdditionalDetails: (state, dropin) => {
}
})
.mount('#dropin');`

或者,通过改变新 AdyenCheckout(配置)new window.AdyenCheckout(configuration),

人们过去似乎已经成功地使用了这种语法。

Using new AdyenCheckout(configuration)

,我收到错误 AdyenCheckout 未定义

Using new window.AdyenCheckout(configuration)

,我收到错误 TypeError: window.AdyenCheckout 不是构造函数

我确信这件事非常简单,我做错了,所以如果有人可以提供帮助,我们将不胜感激。

请帮忙!

最佳答案

这里发生的事情是您尝试在实际加载脚本之前启动 AdyenCheckout。

针对这些情况,最简单的解决方案是在 HTML 文档中添加脚本标记。这样,脚本将在 React 应用程序启动之前加载。

话虽如此,由于您只会在特定部分中使用脚本,因此在 React 应用程序中添加脚本标记确实有意义。

要解决此问题,只需将与 AdyenCheckout 相关的所有功能移至加载脚本后调用的方法即可:

class AdyenDropin extends Component {
constructor(props) {
super(props);
this.initAdyenCheckout = this.initAdyenCheckout.bind(this);
}

componentDidMount() {
const script = document.createElement("script");
script.src =
"https://checkoutshopper-test.adyen.com/checkoutshopper/sdk/3.0.0/adyen.js";
script.onload = this.initAdyenCheckout; // Wait until the script is loaded before initiating AdyenCheckout
document.body.appendChild(script);
}

initAdyenCheckout() {
// ...

这里有一个working example .

干杯!

关于javascript - 无法在 REACT 中创建新的 AdyenCheckout,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56936244/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com