React JS 外部脚本加载

Question

我是 React/Node.js 的初学者，我的自定义 shopify 应用程序开发遇到问题。

我必须从后面在我当前的 shoppify 商店上导入、加载和保存外部 js 文件。

在我的 React 项目中，我可以通过单击按钮时的初始化导入脚本，如下所示：

const onClick = () => {
 if (typeof window !== "undefined") {
      addScript({
        src: `https://sdk.com/loader.js`,
        id: "script",
        async: "true",

        onLoad: () => {
          console.log("script initialized!");
        },
      });
    }
  };

但是当我刷新、关闭并重新打开时，我必须重新导入脚本。

我的问题是，如何调整我的代码以将脚本保存在我的 DOM 上。

谢谢你。

Answer 1

你可以尝试这样的事情

const onClick = () => {
    const exists = document.getElementById("myScript");
    if (!exists) {
        const script = document.createElement("script");
        script.src = "https://sdk.com/loader.js";
        script.id = "myScript";
        document.body.appendChild(script);
        script.onload = () => {
            console.log("Script loaded")
        }
    }
}