javascript - 在 React 组件中动态加载外部 javascript 链接

Question

我正在尝试添加一个来自 React 组件中的一个 API 响应的外部 javascript 链接。下面是我的代码。不幸的是，它不起作用。有什么我错过了吗？我需要重新加载组件吗？如果您之前有任何将外部 JavaScript 添加到您的 React 组件的经验，请指出。先感谢您！

useEffect(() => {
     requestData();
}, []);

requestData = () => {
     try {
      const response = await axios.get('REQUEST DATA URL');

      if (response.status !== 200) {
        throw response;
      }

      const isExternalJsEnabled = get(
        response,
        "data.result_data.is_external_js_enabled",
        false
      );

      if (isExternalJsEnabled) {
        loadExternalJs(response);
      } else {
        // will do normal task here without loading external js 
      }
    } catch (error) {
      setDefaultError();
    } 
}

const loadExternalJs = async responseData => {
    try {
      if (isJsLoaded) {
        // will do task which need external js 
      } else {        
        const jsUrl = get(responseData, "data.result_data.external_js_url","");
        if (jsUrl) {
          const script = document.createElement("script");
          script.src = jsUrl;
          script.async = true;
          document.body.appendChild(script);
        }
        /* eslint-disable no-undef */
        if (typeof TEST === "undefined") {// Here TEST is the object from external javascript file
          // will do normal task here without loading external js 
        } else {
          // will do task which need external js 
        }
      }
    } catch (error) {
      console.error("Loading external JS failed.");
    }
  };

标签： javascriptreactjs