表格所有列label都为空时,不展示表头;isHead

This commit is contained in:
rickcole 2020-06-22 10:46:27 +08:00
parent c38895e794
commit 7e0ce711fb
3 changed files with 25 additions and 16 deletions

View File

@ -2,12 +2,13 @@
表格中的列配置
- `type` 默认为 `text`,支持: `text`、`html`、`tpl`、`image`、`progress`、`status`、`date`、`datetime`、`time`、`json`、`mapping`参考 [Field 说明](./Field.md)和[Operation](./Operation.md)。
- `name` 用来关联列表数据中的变量 `key`
- `label` 列标题。
- `groupName` 如果想要分组,请设置这个!
- `copyable` 开启后,会支持内容点击复制。
- `width` 列宽度。
- `popOver` 是否支持点击查看详情。当内容较长时,可以开启此配置。
- `quickEdit` 配置后在内容区增加一个编辑按钮,点击后弹出一个编辑框。
- `toggled` 控制默认是展示还是不展示,只有 Table 的 `columnsTogglable` 开启了才有效。
- `type` 默认为 `text`,支持: `text`、`html`、`tpl`、`image`、`progress`、`status`、`date`、`datetime`、`time`、`json`、`mapping`参考 [Field 说明](./Field.md)和[Operation](./Operation.md)。
- `name` 用来关联列表数据中的变量 `key`
- `label` 列标题。
- `groupName` 如果想要分组,请设置这个!
- `copyable` 开启后,会支持内容点击复制。
- `width` 列宽度。
- `popOver` 是否支持点击查看详情。当内容较长时,可以开启此配置。
- `quickEdit` 配置后在内容区增加一个编辑按钮,点击后弹出一个编辑框。
- `toggled` 控制默认是展示还是不展示,只有 Table 的 `columnsTogglable` 开启了才有效。
- `isHead` 标识当前列是否以表头的样式展示。

View File

@ -206,7 +206,8 @@
}
}
> thead > tr {
> thead > tr,
> tbody > tr {
background-color: $Table-thead-bg;
> th {

View File

@ -1890,12 +1890,14 @@ export default class Table extends React.Component<TableProps, object> {
</tr>
) : null}
<tr>
{store.filteredColumns.map(column =>
this.renderHeadCell(column, {
'data-index': column.index,
'key': column.index
})
)}
{store.filteredColumns.some(column => !!column.label)
? store.filteredColumns.map(column =>
this.renderHeadCell(column, {
'data-index': column.index,
'key': column.index
})
)
: null}
</tr>
</thead>
<tbody>
@ -2618,6 +2620,7 @@ export class TableCell extends React.Component<RendererProps> {
remark,
prefix,
affix,
isHead,
...rest
} = this.props;
@ -2659,6 +2662,10 @@ export class TableCell extends React.Component<RendererProps> {
return body as JSX.Element;
}
if (isHead) {
Component = 'th';
}
return (
<Component
rowSpan={rowSpan > 1 ? rowSpan : undefined}