Javascript Adyen和#x27；react应用程序中的s Checkout SDK集成

我有一个react应用程序，我想在其中设置adyen（支付处理API）。我想使用checkout SDK（）因为它非常简单， 我已将

js

逻辑移动到

componentDidMount

，但加载sdk时出现问题

<script type="text/javascript" src="https://checkoutshopper-test.adyen.com/checkoutshopper/assets/js/sdk/checkoutSDK.1.6.3.min.js"></script>

我已尝试在我的React组件中使用：

render() {
        return (
            <div className='checkout-warpper'>
               <ScriptTag type="text/javascript" src="https://checkoutshopper-test.adyen.com/checkoutshopper/assets/js/sdk/checkoutSDK.1.9.2.min.js" />

                <div className="checkout" id="adyen-checkout">
                    {/* The checkout interface will be rendered here */}
                </div>
            </div>
        );
    }

---

请尝试

window.chckt.hooks.beforeComplete=…

chckt是一个全局范围变量

加载外部脚本的最简单方法是使用

---

您可以尝试从“react script loader hoc”使用导入脚本加载器；您可以在window.chckt上找到它。

它不再维护了！看一看，您将只从全局范围

窗口访问chckt。chckt…

render() {
        return (
            <div className='checkout-warpper'>
               <ScriptTag type="text/javascript" src="https://checkoutshopper-test.adyen.com/checkoutshopper/assets/js/sdk/checkoutSDK.1.9.2.min.js" />

                <div className="checkout" id="adyen-checkout">
                    {/* The checkout interface will be rendered here */}
                </div>
            </div>
        );
    }

Uncaught ReferenceError: chckt is not defined.

import React from 'react';
import scriptLoader from 'react-async-script-loader'

class CheckoutSDK extends React.Component {

    componentWillReceiveProps({ isScriptLoaded, isScriptLoadSucceed }) {
        if (isScriptLoaded && !this.props.isScriptLoaded) { // load finished
            if (isScriptLoadSucceed) {

                window.chckt.hooks.beforeComplete = function(node, paymentData) {
                    return false; // Indicates that you want to replace the default handling.
                };

            }
        }
    }

    render() {
        return null
    }

}

export default scriptLoader('https://checkoutshopper-test.adyen.com/checkoutshopper/assets/js/sdk/checkoutSDK.1.6.3.min.js',)(CheckoutSDK)