如何更改 Ant 表头复选框

IT技术 javascript html reactjs antd
2021-04-27 17:05:32

我的应用程序中有一个表,我在其中对每一行使用 select。

当我单击并选择行时,左上角会出现一个选中的复选框。我不想显示该复选框,我想显示其他内容,例如带有文本的 div。只有当我单击一行中的复选框时,该 div 才会出现。

这个怎么做?我试图找到呈现该复选框的事件,但我没有找到。如何访问该元素并在其他元素中更改它?沙箱链接:https : //codesandbox.io/s/selection-ant-design-demo-vlftk? file =/index.js

1个回答

我们可以在 props rowSelection设置自定义组件到columnTitle<Table />

设置选择列的标题
类型:string|React.ReactNode

参考:Antd Table rowSelection文档

const rowSelection = {
  columnTitle: selectedRowKeys.length > 0 ? <div>XXX</div> : <></>,
  ...
}

<Table rowSelection={rowSelection} />;

在此处输入图片说明