Javascript 在React组件中显示自定义的第三方html元素

我试图显示一个自定义HTML模式，它是从功能性React组件中的第三方库返回的

这是应加载模态的函数，在useEffect中调用该函数：

const modalRef=useRef（）
const loadScript=async（）=>{
//自定义脚本加载程序
const loader=新脚本加载器({
src:'checkout.reepay.com/checkout.js'，
全球：“Reepay”，
})
等待加载程序。加载（）
//用于显示div的标志
setLoaded（真）
//Reepay.ModalCheckout（sessionId）应打开一个模式
modalRef.current.innerHTML=new window.Reepay.ModalCheckout（sessionId）
}

从他们的文档（）来看，

Reepay.ModalCheckout的实例似乎是一个对象，而不是HTML：

// Step 1: Initialize
var rp = new Reepay.ModalCheckout();  // No session id given

// ... Backend to backend call ... 

// Step 2: Load the modal 
rp.show(' YOUR SESSION ID HERE ');  // Call the .show function with the session id

您不必将其注入模态内部，因为它具有自己的模态

如果确实要将其注入容器，则应使用：

var rp = new Reepay.EmbeddedCheckout(' YOUR SESSION ID HERE ', { html_element: 'rp_container' } );