javascript - Highcharts w/React - 在 JSX 中找不到渲染 div

Question

我正在尝试将 Highcharts 与我的 Web 应用程序一起使用，该应用程序是用 React 编写的。 Highcharts 通过 div 标签呈现。

我正在从 JSX 文件渲染页面上的所有内容(即面板、输入字段、按钮、表格、下拉列表等)。 当我尝试使用 id 或类将 div 标签粘贴到 JSX 中以将其链接到 Highcharts JavaScript 时，我在控制台中收到一条错误消息(Highcharts 错误 #13)，指出未找到渲染 div。

   render() {
     return ( <div>
      <div id="container"></div>
      </div>
       );
      }
     }

但是，当我将 div 标签粘贴到 HTML 中并使用 id 或类将其链接到我的 Highcharts JavaScript 时，我可以让图表显示在页面上，但我希望它位于我的 JSX 中，以便我可以将其放置在我的 JSX 中的面板、容器等内部。

Answer 1

在这里回答我自己的问题，问题是在 highcharts 尝试查找 div 之后调用渲染函数。您可以将图表渲染代码放在 componentDidMount() 部分，在其上放置一个计时器，或者直接使用angerouslySetInnerHTML 渲染highcharts 代码。