一、元件中使用className:
<Table
rowKey="id"
loading={store.isFetching}
dataSource={data}
pagination={false}
className="fileManagerTable"
scroll={{ y: 600 }}
>
<Table.Column
title="名稱"
dataIndex="name"
key="name"
render={(text, record) => (
<Button type="link" icon="folder-open" onClick={() => this.onOpenFolder(text)}>{text}</Button>
)}
/>
<Table.Column
title="大小"
dataIndex="size"
key="size"
/>
</Table>
二、元件中引入樣式檔案:
import "./table.module.css";
三、樣式檔案中使用“:global”:
:global(.fileManagerTable){
border: 1px solid #ececec;
}
:global(.fileManagerTable .ant-table-thead tr th){
padding: 8px 16px!important;
}
:global(.fileManagerTable .ant-table-body tr td){
padding: 2px 16px!important;
}