• ..

now

    JSXの中にインラインスクリプトを埋め込む

    インラインスクリプト

    こんな感じのインラインスクリプトを用意します。以下はGoogleAnalyticsの埋め込みタグです。

    <script async src="https://www.googletagmanager.com/gtag/js?id=あなたのid"></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());
      gtag('config', 'あなたのid');
    </script>

    JSXに変換

    dangerouslySetInnerHTMLattrに__html: 'インラインスクリプト'を持ったオブジェクトをセットします。

    <script async src="https://www.googletagmanager.com/gtag/js?id=あなたのid" />
    <script
      dangerouslySetInnerHTML={{
        __html: `
          window.dataLayer = window.dataLayer || [];
          function gtag(){dataLayer.push(arguments);}
          gtag('js', new Date());
          gtag('config', 'あなたのid');
        `
      }}
    />

    dangerouslySetInnerHTML.__htmlは最初気持ち悪く感じるかもですが、こういうものなのでしょうがないです。
    中身ないので/>にするのも忘れずに書き換えます。