Reactjs 如何从index.html中包含的javascript库中引用类和方法

我有一个内置的水疗中心。我需要包含一个用于CDN分析的JavaScript库——它不应该与其他JS库捆绑在一起

到目前为止，我了解到这不是webpack的工作，我应该使用脚本加载程序，比如scriptjs。我找到了此线程，但无法理解其实现：

我需要：

包括CDN中的JS库。到目前为止，我已经在Index.html页面上引用了它。（即

）

从React应用程序中的组件引用库。有一个类

utag

，其中包含方法

view（）

和

link（）

，我需要在应用程序中按下按钮时调用这些方法。如果我在react组件的方法中尝试utag.link（），则对象utag未定义，react将不会编译

如何包含该库，以便所有组件都可以访问它，以及如何引用所需的类和方法

---

谢谢

HTML中的脚本引用很好

对于分析，您可能希望在应用程序中构建一个包装器，用于处理事件和测试下游功能的可用性，如下所示：

var analytics = {
  view: function(a,b,c){
    if(window.utag && window.utag.view && typeof window.utag.view == "function"){
      window.utag.view(a,b,c);
    } else {
      // handle lack of Tealium availability here
    }
  },
  link: function(a,b,c){
    if(window.utag && window.utag.link && typeof window.utag.link == "function"){
      window.utag.link(a,b,c);
    } else {
      // handle lack of Tealium availability here
    }
  }
};

---

然后，您可以立即使用analytics.view（）和analytics.link（），并编写代码来处理尚未加载的Tealium（例如，延迟一秒钟，然后进行后续尝试）。

您做得很好-只需将其包含到index.html中即可。其余部分取决于utag库导出类的方式。如果它只是定义全局变量，那么您可以使用window.utag访问它。