antd 5.x 获取Table 的 dataSource

在 Ant Design 5.x 版本中，Table 组件的 dataSource 通过 props 传入。如果你想要获取 Table 的 dataSource，可以通过以下两种方式：

1. 使用 ref 获取 Table 组件实例，然后通过实例的 state 获取 dataSource。

例如：

import React, { useRef } from 'react';
import { Table } from 'antd';

const Demo = () => {
  const tableRef = useRef();

  const handleClick = () => {
    console.log(tableRef.current.state.dataSource);
  };

  return (
    <>
      <Table
        ref={tableRef}
        dataSource={[
          { id: 1, name: 'Tom' },
          { id: 2, name: 'Jerry' }
        ]}
        columns={[
          { title: 'ID', dataIndex: 'id' },
          { title: 'Name', dataIndex: 'name' }
        ]}
      />
      <button onClick={handleClick}>Get dataSource</button>
    </>
  );
};

2. 将 dataSource 存储在 state 中，并在需要的时候读取。

例如：

import React, { useState } from 'react';
import { Table } from 'antd';

const Demo = () => {
  const [dataSource, setDataSource] = useState([
    { id: 1, name: 'Tom' },
    { id: 2, name: 'Jerry' }
  ]);

  const handleClick = () => {
    console.log(dataSource);
  };

  return (
    <>
      <Table
        dataSource={dataSource}
        columns={[
          { title: 'ID', dataIndex: 'id' },
          { title: 'Name', dataIndex: 'name' }
        ]}
      />
      <button onClick={handleClick}>Get dataSource</button>
    </>
  );
};