使用 React 重新渲染时，Highcharts Y 轴覆盖答案

【问题标题】：Highcharts Y Axis overlay while re-rendering with React使用 React 重新渲染时，Highcharts Y 轴覆盖
【发布时间】：2021-10-27 02:33:28
【问题描述】：

我使用spline 图表和scrollablePlotArea 选项定义了我的案例。当页面第一次加载完成时，Y 轴被正确渲染，但是由于父组件的一些重新渲染，Y 轴将被绘图区域重叠。

检查此行为，我发现第一次加载页面时，Y 值在highcharts-fixed div 中呈现，但任何事件使此图表重新呈现，Y 值将在@987654327 中呈现@，我认为这是造成这个问题的根本原因。

对此解决方法的任何想法将不胜感激，

提前致谢，

【问题讨论】：

嗨@Duc Hong，如果您有静态图表，最简单的解决方案是将allowChartUpdate 选项设置为false：github.com/highcharts/highcharts-react#options-details
好吧，正如文档所说，我已经设法在初始化组件时将选项 immutable 设置为 true 来解决这个问题。但仍然要解决这个问题的根本原因，因为在我的情况下，数据将在我从下拉列表中选择一个选项后更新
您使用了旧版本的 highcharts-react-official 包装器。请使用最新的（2.2.2）：codesandbox.io/s/highcharts-react-demo-i4xgz
哦，很抱歉演示链接上的旧版本，但在我的实际项目中，我也在使用 2.2.2。有趣的是，当我复制了您链接上的选项时，虽然它适用于代码和框，但覆盖问题仍然发生在我的本地，所以很奇怪

【解决方案1】：

这个问题是一个 Highcharts 错误，在这里报告：https://github.com/highcharts/highcharts/issues/8862

作为一种解决方法，您可以使用 github 线程中的代码，但也可以将 immutable 设置为 true 或将 allowChartUpdate 设置为 false 应该可以解决问题。

<HighchartsReact
    ...
    immutable = { true }
/>

文档： https://github.com/highcharts/highcharts-react#options-details

【讨论】：