Highcharts yAxis 选项未通过 React 中的状态更新

Question

我不确定我是否做错了，但我最近注意到一个问题，即通过 React 状态对 yAxis 选项（特别是 max/softMax）进行的一些更新不会导致图表正确重新渲染。

这是一个最小的复制案例：https://codesandbox.io/p/sandbox/highcharts-react-demo-forked-jhsmq4?file=%2Fdemo.jsx%3A30%2C4

1. 该示例有一个图表，其中点 [1,2,3] 且 yAxis[0].softMax 设置为 2。因此该图表显示所有点。
2. 如果您点击切换按钮，导致 yAxis[0].max 设置为 2 并且 softMax 被删除。图表正确更新，y 轴的最大值设置为 2，因此第三个点被隐藏。
3. 如果再次点击切换按钮，图表将返回到步骤 1 的状态：添加 softMax=2 并删除 max=2。然而，图表没有更新。 yAxis 的最大值仍然是 2，第三个点仍然隐藏。

也许这是具有 min/max 和 softMin/softMax 的某些特定边缘情况，因为对 yAxis 选项对象的所有其他更新都导致了正确的重新渲染。

Answer 1

看起来一切都很好！之所以会出现混乱，是因为 max 选项仍然设置为 2，使得 softMax 看起来停止工作。

要解决此问题，请记住在更新.softMax 时将 yAxis.max 设置为 undefined。演示：https://codesandbox.io/p/sandbox/highcharts-react-demo-forked-33s3v4?file=%2Fdemo.jsx%3A34%2C1-41%2C11

const yAxisOptions = useSoftMax
  ? {
      softMax: 2,
      max: undefined,
    }
  : {
      max: 2,
};