diff --git a/components/table/demo/colspan-rowspan.md b/components/table/demo/colspan-rowspan.md index 1042956e9c..4b72a5fd0b 100644 --- a/components/table/demo/colspan-rowspan.md +++ b/components/table/demo/colspan-rowspan.md @@ -1,5 +1,6 @@ --- order: 15 +version: 4.18.0 title: en-US: colSpan and rowSpan zh-CN: 表格行/列合并 @@ -22,70 +23,53 @@ import { Table } from 'antd'; // In the fifth row, other columns are merged into first column // by setting it's colSpan to be 0 -const renderContent = (value, row, index) => { - const obj = { - children: value, - props: {}, - }; +const sharedOnCell = (_, index) => { if (index === 4) { - obj.props.colSpan = 0; + return { colSpan: 0 }; } - return obj; }; const columns = [ { title: 'Name', dataIndex: 'name', - render: (text, row, index) => { - if (index < 4) { - return {text}; - } - return { - children: {text}, - props: { - colSpan: 5, - }, - }; - }, + render: (text, row, index) => {text}, + onCell: (_, index) => ({ + colSpan: index < 4 ? 1 : 5, + }), }, { title: 'Age', dataIndex: 'age', - render: renderContent, + onCell: sharedOnCell, }, { title: 'Home phone', colSpan: 2, dataIndex: 'tel', - render: (value, row, index) => { - const obj = { - children: value, - props: {}, - }; + onCell: (_, index) => { if (index === 2) { - obj.props.rowSpan = 2; + return { rowSpan: 2 }; } // These two are merged into above cell if (index === 3) { - obj.props.rowSpan = 0; + return { rowSpan: 0 }; } if (index === 4) { - obj.props.colSpan = 0; + return { colSpan: 0 }; } - return obj; }, }, { title: 'Phone', colSpan: 0, dataIndex: 'phone', - render: renderContent, + onCell: sharedOnCell, }, { title: 'Address', dataIndex: 'address', - render: renderContent, + onCell: sharedOnCell, }, ]; diff --git a/components/table/index.en-US.md b/components/table/index.en-US.md index d3c599feeb..1033cedefd 100644 --- a/components/table/index.en-US.md +++ b/components/table/index.en-US.md @@ -134,7 +134,7 @@ One of the Table `columns` prop for describing the table's columns, Column has t | filters | Filter menu config | object\[] | - | | | fixed | (IE not support) Set column to be fixed: `true`(same as left) `'left'` `'right'` | boolean \| string | false | | | key | Unique key of this column, you can ignore this prop if you've set a unique `dataIndex` | string | - | | -| render | Renderer of the table cell. The return value should be a ReactNode, or an object for [colSpan/rowSpan config](#components-table-demo-colspan-rowspan) | function(text, record, index) {} | - | | +| render | Renderer of the table cell. The return value should be a ReactNode | function(text, record, index) {} | - | | | responsive | The list of breakpoints at which to display this column. Always visible if not set. | [Breakpoint](https://github.com/ant-design/ant-design/blob/015109b42b85c63146371b4e32b883cf97b088e8/components/_util/responsiveObserve.ts#L1)\[] | - | 4.2.0 | | shouldCellUpdate | Control cell render logic | (record, prevRecord) => boolean | - | 4.3.0 | | showSorterTooltip | If header show next sorter direction tooltip, override `showSorterTooltip` in table | boolean \| [Tooltip props](/components/tooltip/) | true | | diff --git a/components/table/index.zh-CN.md b/components/table/index.zh-CN.md index 755a367757..cf7ee91007 100644 --- a/components/table/index.zh-CN.md +++ b/components/table/index.zh-CN.md @@ -141,7 +141,7 @@ const columns = [ | filters | 表头的筛选菜单项 | object\[] | - | | | fixed | (IE 下无效)列是否固定,可选 true (等效于 left) `left` `right` | boolean \| string | false | | | key | React 需要的 key,如果已经设置了唯一的 `dataIndex`,可以忽略这个属性 | string | - | | -| render | 生成复杂数据的渲染函数,参数分别为当前行的值,当前行数据,行索引,@return 里面可以设置表格[行/列合并](#components-table-demo-colspan-rowspan) | function(text, record, index) {} | - | | +| render | 生成复杂数据的渲染函数,参数分别为当前行的值,当前行数据,行索引 | function(text, record, index) {} | - | | | responsive | 响应式 breakpoint 配置列表。未设置则始终可见。 | [Breakpoint](https://github.com/ant-design/ant-design/blob/015109b42b85c63146371b4e32b883cf97b088e8/components/_util/responsiveObserve.ts#L1)\[] | - | 4.2.0 | | shouldCellUpdate | 自定义单元格渲染时机 | (record, prevRecord) => boolean | - | 4.3.0 | | showSorterTooltip | 表头显示下一次排序的 tooltip 提示, 覆盖 table 中 `showSorterTooltip` | boolean \| [Tooltip props](/components/tooltip/#API) | true | | diff --git a/package.json b/package.json index 7bdff68497..2262da8801 100644 --- a/package.json +++ b/package.json @@ -143,7 +143,7 @@ "rc-slider": "~9.7.4", "rc-steps": "~4.1.0", "rc-switch": "~3.2.0", - "rc-table": "~7.20.0", + "rc-table": "~7.21.0", "rc-tabs": "~11.10.0", "rc-textarea": "~0.3.0", "rc-tooltip": "~5.1.1",