字段
ellipsis
意思是 columns 中的当单元格中内容太长,显示…
const columns: ColumnsType<FileInfo> = [
{
title: '文件名',
dataIndex: 'file_name',
key: 'file_name',
ellipsis: true,
render: (text: string) => <Text strong>{text}</Text>,
},
{
title: '文件大小',
dataIndex: 'file_size',
key: 'file_size',
width: 120,
render: (size: number) => formatFileSize(size),
},
{
title: '上传时间',
dataIndex: 'uploaded_at',
key: 'uploaded_at',
width: 180,
render: (date: string) => formatDateTime(date),
},
{
title: '操作',
key: 'actions',
width: 220,
render: (_, record: FileInfo) => (
<Space size="small">
<Button
type="link"
icon={<EyeOutlined />}
onClick={() => handlePreview(record)}
>
预览
</Button>
<Button
type="link"
icon={<DownloadOutlined />}
onClick={() => handleDownload(record)}
>
下载
</Button>
<Button
type="link"
danger
icon={<DeleteOutlined />}
onClick={() => handleDelete(record)}
>
删除
</Button>
</Space>
),
},
];