如何使用HighchartsReact with Ref？我想使用setChartOptions并更新，但这是不可能的。

const LineChart: FC<SubscriberType> = ({ client }) => {
    **const chartRef = useRef(null);**
      const initChartOptions = {
        title: {
          text: 'Loading...',
        },
        xAxis: {
          categories: ['Loading...'],
        },
        series: [{ data: [], name: 'signal' }],
      };

      let updateChartOptions: unknown;

      client.on('message', (topic: string, message: string) => {
        const signalData = JSON.parse(message);
        console.log(signalData);
        updateChartOptions = {
          title: {
            text: topic,
          },
          xAxis: {
            categories: [
              '1',
              '2',
              '3',
              '4',
              '5',
              '6',
              '7',
              '8',
              '9',
              '10',
              '11',
              '12',
              '13',
              '14',
              '15',
            ],
          },
          series: [{ data: signalData, name: 'signal' }],
        };
      });

      useEffect(() => {
      **chartRef.current.charts.setChartOptions(updateChartOptions);**
      **chartRef.current.charts.update(updateChartOptions);**
        console.log('LineChart');
      }, [updateChartOptions]);

      return (
        <div className="Main">
          <HighchartsReact
          **ref={chartRef}**
            containerProps={{ style: { width: '100%' } }}
            highcharts={Highcharts}
            options={initChartOptions}
            updateArgs={[true]}
            OnetoOne={this}
            allowChartUpdate
          />
        </div>
      );
    };

帮助我请我想活更新我的highcharts与参考
我想使用ref而不是state来最小化资源
如果你知道如何用最少的资源绘制 highcharts ，请让我知道