现在，正如我之前讨论过的散点图（Inconsistent Data Points in HighCharts Scatter Plot with ReactJS）的问题，我们不能像HighCharts中的其他类型一样直接使用setState方法更新数据。
所以，我需要更新数据使用参考只（在散点图）。

我的场景：

我从父组件中获取最小值和最大值，并将XAxis中的最小值和最大值传递给负责显示绘图的子组件。

问题：

=>当组件首次挂载时- chartOptions被初始化，其中序列数据为空（因为maindata为空）。现在，useEffect运行并调用一个API，它将获取数据，我将使用ref方法将数据传递到highcharts中，如下所示.

useEffect(() => {
    const chart = chartRef.current.chart;
    if (chart) {
       chart.series[0].setData(mainData, true, true, false);
    }
}, [data]);

现在，当用户点击刷新图标-我将再次获取数据，我可以使用上述方法更新系列数据。但是，为了在XAxis中设置最小值和最大值-我必须这样做（我需要再次设置它，因为我想将范围选择器放置在相同的范围内）：

useEffect(() => {
   setChartOptions((prevState) => ({
        ...prevState,
        xAxis: [
          {
            ...prevState.xAxis[0],
            min: xMax.maxX - 50,
            max: xMax.maxX,
          },
        ],
}));
}, [data]);

重现问题步骤：

=>第一次绘图是不来作为数据是空的，比数据来自API，这将被设置使用ref，所以现在数据不是空的，我们可以看到图.
然后，setChartOptions将运行，它只会改变最小值和最大值，并保持其他内容与以前相同，因此数据将再次为空，因为它默认为空（mainData第一次为空）。
所以，情节消失了，可以看到只是空白的白色屏幕.

期望值：

=>我认为，我们可以这样解决这个问题：
无论如何，我们可以先设置一个机制来运行setChartOptions，这样就设置了min和max，只有than和than，我们将使用ref（chart.series[0].setData（mainData，true，true，false）;）：

到目前为止，我已经尝试过：

=>简单来说，我们可以通过set方法直接设置Series数据，如下所示：

setChartOptions((prevState) => ({
  ...prevState,
  series: [
    {
      ...prevState.series[0],
      data: mainData, // Update with the fetched data
    },
  ],
  xAxis: [
    {
      ...prevState.xAxis[0],
      min: xMax.maxX - 50,
      max: xMax.maxX,
    },
  ],
}));

但是，这不是散点图中的工作案例（Highcharts BUG）
但是，我不知道如何用ReactJS解决这个问题。
实际上，我无法创建演示代码，因为数据来自API，但您可以将此代码作为引用，其中我使用ref更新数据：
https://stackblitz.com/edit/react-9wsnd9?file=index.js

更新：

嘿，谢谢你的快速回复，但我仍然无法解决我的问题：
代码如下：https://stackblitz.com/edit/react-sgkrzf?file=index.js

**解释：**From parent -我将min={20}和max={40}传递给子组件。
**预期行为：**默认情况下，最小值和最大值应同时应用（两者一起应用），但两者不同时工作（如果最小值应用，则最大值不适用，如果最大值忽略，则最小值忽略）

我想最初应用最小和最大分别为20和40，比用户可以改变范围选择器和刷新，应保留更改后的值。
即=>在刷新数据（我的意思是说调用API）后，将范围选择器（20，40）更改为（34，75）应保留为（34，75）
如何做到这一点？请修改上面的代码，并帮助我与相同的。
先谢了。