import React, { useRef } from 'react';
import Handsontable from 'handsontable';
import 'handsontable/dist/handsontable.full.css';
import 'handsontable-context-menu/dist/handsontable-contextMenu.min.css';
import { HotTable } from '@handsontable/react';

const App = () => {
  const hotTableRef = useRef(null);

  const data = [
    ['', 'Ford', 'Volvo', 'Toyota', 'Honda'],
    ['2019', 10, 11, 12, 130],
    ['2020', 20, 11, 14, 130],
    ['2021', 30, 15, 12, 130],
  ]; // 使用英文分号

  return (
    <div>
      <HotTable
        ref={hotTableRef}
        data={data}
        colHeaders={true}
        rowHeaders={true}
        contextMenu={true}
        licenseKey="non-commercial-and-evaluation"
      />
    </div>
  );
};

export default App;