React Helmet TypeError：无法将符号值转换为字符串

Question

我正在尝试使用以下react-helmet将Google Analytics添加到我的网站：

         <Helmet
              htmlAttributes={{
                lang: this.props.language
                  ? convertLangCodeToISO639(this.props.language)
                  : "en",
              }}
            >
              {this.props.googleTrackingID && (
                <>
                  <script
                    async
                    src={`https://www.googletagmanager.com/gtag/js?id=${this.props.googleTrackingID}`}
                  ></script>
                  <script>
                    {`window.dataLayer = window.dataLayer || [];
            function gtag(){dataLayer.push(arguments);}
            gtag('js', new Date());
            gtag('config', \"${this.props.googleTrackingID}\");`}
                  </script>
                </>
              )}
            </Helmet>

不幸的是这给出了错误：

类型错误：无法将符号值转换为字符串。Helmet 不支持渲染 <" + child.type + "> 元素。请参阅我们的 API 了解更多信息。

这不是我正在做的事情，因为我正在使用<script>标签。我还需要外部 JSX 标签，因为有两个子<script>标签。

是什么导致了这个错误？

Answer 1

我最终能够使用多个<Helmet>标签来做到这一点，将 JSX 条件移动到头盔外部：

         <Helmet
              htmlAttributes={{
                lang: this.props.language
                  ? convertLangCodeToISO639(this.props.language)
                  : "en",
              }}
            />
            {/*  Google Analytics */}
            {this.props.survey.googleTrackingID && (
              <Helmet>
                <script
                  async
                  src={`https://www.googletagmanager.com/gtag/js?id=${this.props.survey.googleTrackingID}`}
                ></script>
                <script>
                  {`window.dataLayer = window.dataLayer || [];
            function gtag(){dataLayer.push(arguments);}
            gtag('js', new Date());
            gtag('config', "${this.props.survey.googleTrackingID}");`}
                </script>
              </Helmet>
            )}