Question

我正在尝试将this script添加到我的react应用程序中。

我的public/index.html文件包含

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1, shrink-to-fit=no"
    />
    <meta name="theme-color" content="#000000" />
    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
    <title>...</title>
  </head>
  <body>
    <noscript> You need to enable JavaScript to run this app. </noscript>
    <div id="root"></div>
    <script
      src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
      integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
      crossorigin="anonymous"
    ></script>
    <script
      src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"
      integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49"
      crossorigin="anonymous"
    ></script>
    <script
      src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"
      integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy"
      crossorigin="anonymous"
    ></script>
    <link
      rel="stylesheet"
      href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"
      integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO"
      crossorigin="anonymous"
    />
    <script src="../src/scripts/blink.js"></script>
    <link
      rel="stylesheet"
      href="https://use.fontawesome.com/releases/v5.6.1/css/all.css"
      integrity="sha384-gfdkjb5BdAXd+lj+gudLWI+BXq4IuLW5IT+brZEZsLFm++aCMlF1V92rMkPaX4PP"
      crossorigin="anonymous"
    />
  </body>
</html>

我的React应用程序按预期在我的端口，引导程序和字体真棒上加载得很好。但是，该特定模块似乎无法正常运行。我已经列出了here on Bootstrap's网站上的所有必要链接。我不确定自己在做什么错。当我在客户端中查看源代码时，单击../src/scripts/blink.js只会在新标签中打开我的登录页面。

这是我供参考的功能版本，

titlebar = val => {
  var msg = "This is side ";
  var speed = 500;
  var pos = val;
  var msg1 = msg + "A";
  var msg2 = msg + "B";
  if (pos == 0) {
    masg = msg1;
    pos = 1;
  } else if (pos == 1) {
    masg = msg2;
    pos = 0;
  }
  document.title = masg;
  timer = window.setTimeout("titlebar(" + pos + ")", speed);
};
titlebar(0);

Answer 1

如果您在做出反应时这样做，那么以更自然的方式重新实现此脚本可能会有所帮助。例如：

var convertPriceFormat = function(content) {
  var obj = {};

  for (var appid in content) {
    console.log(`appid: ${appid}`)

    var gameEntry = content[appid];

    for (var hashName in gameEntry) {
        console.log(`hashName: ${hashName}`)

      var entry = gameEntry[hashName];
      obj[hashName] = entry.price;
    };

    console.log(Object.keys(gameEntry).length);
  };

  return obj;
}

const entry1 = {
  'Pinstripe Suit Jacket': {
    average_price: 0.02,
    listings: 11,
    volume: 1185.03,
    price: 0.03
  }
}

const entries = []

for (let i = 0; i < 3000; i++) {
  entries.push(entry1)
}

console.log(`Number of entries: ${entries.length}`)

convertPriceFormat(entries.slice(0,3))

如何在React应用程序组件中添加自定义脚本？

1 个答案: