我需要highcharts调整其宽度以适应父级的宽度。因此，如果我们改变父级的宽度而不改变数据，图表应该调整大小。但由于数据是相同的，所以不会发生这种情况。
如果我们调整浏览器屏幕的大小，它似乎可以工作，但这不是我们所需要的。

import React, { useState } from 'react';
import { render } from 'react-dom';
import HighchartsReact from 'highcharts-react-official';
import Highcharts from 'highcharts';

function getRandomIntInclusive(min, max) {
  min = Math.ceil(min);
  max = Math.floor(max);
  return Math.floor(Math.random() * (max - min + 1) + min);
}

const LineChart = () => {
  const [width, setWidth] = useState(null);
  const [chartOptions, setChartOptions] = useState({
    xAxis: {
      categories: ['A', 'B', 'C'],
    },
    series: [{ data: [1, 2, 3] }],
  });

  const handleWidth = () => {
    const w = getRandomIntInclusive(100, 500);
    setWidth(w);
  };

  return (
    <div style={{ width }}>
      <HighchartsReact highcharts={Highcharts} options={chartOptions} />
      <button onClick={handleWidth}>change container width</button>
    </div>
  );
};

render(<LineChart />, document.getElementById('root'));

下面是一个指向“不工作”示例的链接：https://stackblitz.com/edit/react-xhcmx4?file=index.js