const columns: TableColumnsType<DataType> = [
{
title: "dalianTeam",
dataIndex: "dalianTeam",
key: "1",
render: (text) => (
<div style={{ minWidth: "100px",
wordBreak: "break-all" }}>{text}</div>
),
},
{
title: 'tokyoTeam',
dataIndex: 'tokyoTeam',
key: '2',
width:200,
render: (text) => (
<div style={{ width: "100px",
wordBreak: "break-all" }}>{text}</div>
)
},
{
title: 'name',
dataIndex: 'name',
key: '3',
render: (text) => (
<div style={{ width: "150px",
wordBreak: "break-all" }}>{text}</div>
)
},
{
title: 'project',
dataIndex: 'project',
key: '4',
render: (text) => (
<div style={{ width: "120px",
wordBreak: "break-all" }}>{text}</div>
)
},
{
title: 'workingTime',
dataIndex: 'workingTime',
key: '5',
render: (text) => (
<div style={{ width: "100px",
wordBreak: "break-all" }}>{text}</div>
)
}, {
title: 'entity',
dataIndex: 'entity',
key: '8',
render: (text) => (
<div style={{ width: "100px",
wordBreak: "break-all" }}>{text}</div>
)
}, {
title: 'task',
dataIndex: 'task',
key: '6',
render: (text) => (
<div style={{ width: "550px",
wordBreak: "break-all" }}>{text}</div>
)
}, {
title: 'memo',
dataIndex: 'memo',
key: '7',
render: (text) => (
<div style={{ width: "400px",
wordBreak: "break-all" }}>{text}</div>
)
}
];Spin spinning={loading} style={{ flex: 1, overflow: "hidden", }}>
{/*
表格容器 */}
<div
style={{
width: "100%",
overflowX: "auto", // 确保
表格内容可以水平滚动
}}
>
<Table
columns={columns}
dataSource={paginatedData}
pagination={false}
bordered
scroll={{ x: "max-content", y: "calc(100vh - 300px)" }}
rowClassName={(record, index) => (index % 2 === 0
? "even" : "odd")}
components={{
header: {
cell: (props: any) => <th {...props} style={{ backgroundColor: '#769fcd', color: 'black' }} />,
},
}}
/>
</div>
</Spin>我的页面通过筛选才能得到值，在没筛选时只渲染表头，但是因为有滚动条存在，表头多一列，怎么解决，通过调整表头宽度也行
扫一扫
1576
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
