Reactjs 蚂蚁设计&x2B；反应台。如何在Ant Design提供的UI元素之上构建react表的过滤功能？

我一直在看和之间的文件。似乎Ant design在允许开发者自由地向

、

或

添加道具方面有点固执己见

React表是一个为开发人员提供React钩子来与我们自己的UI元素一起使用的表，但我目前的问题是能否将这些钩子发送到AntD表元素的核心UI元素中

有没有人遇到过类似的问题？如果是这样，你的解决办法是什么

---

我不想从react表和Ant设计中取出大量源代码，最终构建出我自己的react表/AntD表混合解决方案

最丑陋、最简单的方法是只使用从表组件中提取的类名。您将失去AntD表的功能，但我认为，这就是您要寻找的

const SampleTable = () => {
  return (
    <>
      <table style={{ tableLayout: "auto" }}>
        <colgroup></colgroup>
        <thead className="ant-table-thead">
          <tr>
            <th className="ant-table-cell">Name</th>
            <th className="ant-table-cell">Age</th>
          </tr>
        </thead>
        <tbody className="ant-table-tbody">
          <tr className="ant-table-row ant-table-row-level-0">
            <td className="ant-table-cell">
              <a>John Brown</a>
            </td>
            <td className="ant-table-cell">21</td>
          </tr>
          <tr className="ant-table-row ant-table-row-level-0">
            <td className="ant-table-cell">
              <a>Jim Green</a>
            </td>
            <td className="ant-table-cell">21</td>
          </tr>
          <tr className="ant-table-row ant-table-row-level-0">
            <td className="ant-table-cell">
              <a>Joe Black</a>
            </td>
            <td className="ant-table-cell">21</td>
          </tr>
        </tbody>
      </table>
    </>
  );
};

const SampleTable=（）=>{
返回(
名称
年龄
约翰布朗
21
吉姆·格林
21
乔·布莱克
21
);
};

AntD提供了一个

components

prop，允许您为标题、行、单元格等定义自定义组件，以及

onHeader/HeaderCell/etc

props以提供自定义道具。您试图自定义哪些功能无法使用其内置功能进行自定义？另外，在对大型数据集使用行选择时，AntD的表存在一些严重的性能问题。我正在尝试自定义过滤和类型先行功能，该功能可以与AntD的UI元素一起使用。另外，很高兴知道大型数据集存在性能问题。非常感谢。具体来说，我不确定如何将

getTableProps（）

和

getTableBodyProps（）

传递到表包装器和表体包装器到AntD的组件中。我也有这个想法。