将第三方脚本添加到 React

问题描述

我还没有找到涵盖此特定场景的示例：

我正在向我的 React 站点添加一个小部件，它使用如下脚本：

<script>(function(){ var s = document.createElement('script'),e = ! document.body ? document.querySelector('head') : document.body; s.src = 'https://acsbapp.com/apps/app/dist/js/app.js'; s.async = true; s.onload = function(){ acsbJS.init({ statementLink : '',footerHtml : '',hideMobile : false,hideTrigger : false,language : 'en',position : 'right',leadColor : '#146FF8',triggerColor : '#146FF8',triggerRadius : '50%',triggerPositionX : 'right',triggerPositionY : 'bottom',triggerIcon : 'people',triggerSize : 'medium',triggerOffsetX : 20,triggerOffsetY : 20,mobile : { triggerSize : 'small',triggerOffsetX : 10,triggerOffsetY : 10,triggerRadius : '50%' } }); }; e.appendChild(s);}());</script>

但是，我不明白将它添加到我的主文件中的最佳方法，如下所示：

const Theme = ({ state }) => {
  const data = state.source.get(state.router.link);
  
  return (
    <>
      <Head>
        <html lang="en" />
        <Meta name="viewport" content="width=device-width,initial-scale=1.0" />
        <title>{state.frontity.title}</title>
      </Head>

      <ThemeProvider theme={theme}>
        <Global styles={GlobalStyles} />
        <FontStyles />

        <Body>
          <Header />
          <Main>
            <Switch>
              <LoadingPage when={data.isFetching} />
              <Home when={data.isHome} />
              <ContactUs when={data.route === "/contact-us/"} />
            </Switch>
          </Main>
          <Footer />
        </Body>
      </ThemeProvider>
    </>
  );
};

export default connect(Theme);

进行这种集成的最佳方式是什么？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

reactjs reactjs reactjs reactjs

将第三方脚本添加到 React

问题描述

解决方法

相关问答