Javascript 使用React头盔显示脚本标记

我之前发布了关于需要在react.js组件中添加一些脚本标记的文章。不理想，但这不是我的选择。因此，我需要显示来自外部站点的作业列表：

<script src='https://www.workable.com/assets/embed.js' type='text/javascript'></script>
<script type='text/javascript' charset='utf-8'>
whr(document).ready(function(){
whr_embed(266675, {detail: 'titles', base: 'jobs', zoom: 'country', grouping: 'none'});
});
</script>
<div id="whr_embed_hook"></div>

whr（文件）.就绪（功能（）{
whr_嵌入（266675，{细节：“标题”，基础：“工作”，缩放：“国家”，分组：“无”）；
});

我已经尝试使用react头盔，并将上面的脚本标记注入到需要显示列表的页面头标记中

到目前为止，我已经尝试：

import React, { useState } from "react";
import { Helmet } from "react-helmet";
...
return(
      <Helmet>
        <script src="https://www.workable.com/assets/embed.js" />
        <script type="javascript">
          {`
              whr(document).ready(function(){
                  whr_embed(266675, { detail: 'titles', base: 'jobs', zoom: 'country', grouping: 'none' });
              });
            `}
        </script>
      </Helmet>
...

      <div className="container-thin">
        <div id="whr_embed_hook" />
      </div>

)

import React，{useState}来自“React”；
从“react Helmet”导入{Helmet}；
...
返回(
{`
whr（文件）.就绪（功能（）{
whr_嵌入（266675，{细节：“标题”，基础：“工作”，缩放：“国家”，分组：“无”）；
});
`}
...
)

该站点编译得很好，当我在本地主机上运行它时，我可以看到两个脚本标记被注入到该页面的头部，但是作业列表没有显示在目标div标记中

我不知道我是否遗漏了上面的内容，或者在任何人看来，这是一个更好的方式

谢谢

---

Jools

不要将脚本标签放在页面的开头。