如何在点击Highcharts Reactjs中的每一列时添加表格？

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

const [selectedColumnData, setSelectedColumnData] = useState([]);

const options = {
  chart: {
    type: 'column',
    events: {
      click: function(event) {
        const clickedColumnData = event.point.options; // 获取用户点击的列数据
        setSelectedColumnData(clickedColumnData); // 存储到selectedColumnData中
      }
    }
  },
  // 其他配置项...
};

const SelectedColumnTable = () => {
  return (
    <table>
      <thead>
        <tr>
          <th>Column Name</th>
          <th>Data Value</th>
        </tr>
      </thead>
      <tbody>
        {selectedColumnData.map((data, index) => (
          <tr key={index}>
            <td>{data.name}</td>
            <td>{data.y}</td>
          </tr>
        ))}
      </tbody>
    </table>
  );
};

const App = () => {
  return (
    <div>
      <HighchartsReact highcharts={Highcharts} options={options} />
      <SelectedColumnTable />
    </div>
  );
};