时间戳

首页 > 解决方案 > 将多个脚本标签附加到在 React 中同步执行的头部

javascript - 将多个脚本标签附加到在 React 中同步执行的头部

问题描述

我正在尝试使用react-helmet. 我希望这些脚本按照它们包含的顺序执行，正如人们通常期望在常规 HTML 中所期望的那样。但似乎有一个已知的错误使react-helmet脚本异步加载，并且它们以随机顺序执行，这会扰乱预期用途，因为某些脚本依赖于其他脚本。

有没有办法将多个脚本标签附加到<head>页面的响应中，以便它们按顺序执行？

这是我的代码：

    <Helmet>
      {isPermissionAllowed && (
        <script type="text/javascript" src={getFirstEndpoint()}></script>
      )}
      {isPermissionAllowed && (
        <script type="text/javascript">{`window.sample = "${getSample()}";`}</script>
      )}
      {isPermissionAllowed && (
        <script type="text/javascript" src={getSecondEndpoint()}></script>
      )}
      {isPermissionAllowed && (
        <script type="text/javascript">window.example.text["app.sample"] = "sample";</script>
      )}
    </Helmet>

标签： javascriptreactjstypescriptcreate-react-appreact-helmet

解决方案

你可以在你的内部尝试这种方式app.jsx：

const script = document.createElement("script");
script.src = 'Script source';
// script.[add attributes requires to you]
document.head.appendChild(script);

推荐阅读