feat(table): support hideSelectAll prop and (ant-design#24592)

remove hideDefaultSelections prop in rowSelection(ant-design#14581);
bujichong · May 29, 2020 · 49533aa · 49533aa
1 parent 27bc2d1
commit 49533aa
Show file tree

Hide file tree

Showing 8 changed files with 11 additions and 20 deletions.
diff --git a/components/table/__tests__/Table.rowSelection.test.js b/components/table/__tests__/Table.rowSelection.test.js
@@ -286,23 +286,12 @@ describe('Table.rowSelection', () => {
     expect(handleSelectEven).toHaveBeenCalledWith([0, 1, 2, 3]);
   });
 
-  it('could hide default selection options', () => {
+  it('could hide selectAll checkbox and custom selection', () => {
     const rowSelection = {
-      hideDefaultSelections: true,
-      selections: [
-        {
-          key: 'odd',
-          text: '奇数项',
-        },
-        {
-          key: 'even',
-          text: '偶数项',
-        },
-      ],
+      hideSelectAll: true,
     };
     const wrapper = mount(createTable({ rowSelection }));
-    const dropdownWrapper = mount(wrapper.find('Trigger').instance().getComponent());
-    expect(dropdownWrapper.find('.ant-dropdown-menu-item').length).toBe(2);
+    expect(wrapper.find('.ant-selection').exists()).toBeFalsy();
   });
 
   it('handle custom selection onSelect correctly when hide default selection options', () => {

diff --git a/components/table/demo/row-selection-custom.md b/components/table/demo/row-selection-custom.md
@@ -56,7 +56,6 @@ class App extends React.Component {
     const rowSelection = {
       selectedRowKeys,
       onChange: this.onSelectChange,
-      hideDefaultSelections: true,
       selections: [
         Table.SELECTION_ALL,
         Table.SELECTION_INVERT,

diff --git a/components/table/hooks/useSelection.tsx b/components/table/hooks/useSelection.tsx
@@ -83,6 +83,7 @@ export default function useSelection<RecordType>(
     selections,
     fixed,
     renderCell: customizeRenderCell,
+    hideSelectAll,
   } = rowSelection || {};
 
   const {
@@ -151,7 +152,7 @@ export default function useSelection<RecordType>(
   );
 
   const mergedSelections = React.useMemo<SelectionItem[] | null>(() => {
-    if (!selections) {
+    if (!selections || hideSelectAll) {
       return null;
     }
 
@@ -308,7 +309,7 @@ export default function useSelection<RecordType>(
           return checkboxProps.disabled;
         });
 
-        title = (
+        title = !hideSelectAll && (
           <div className={`${prefixCls}-selection`}>
             <Checkbox
               checked={!allDisabled && !!flattedData.length && checkedCurrentAll}

diff --git a/components/table/index.en-US.md b/components/table/index.en-US.md
@@ -188,7 +188,7 @@ Properties for row selection.
 | columnTitle | Set the title of the selection column | string\|React.ReactNode | - | 4.0 |
 | fixed | Fixed selection column on the left | boolean | - | 4.0 |
 | getCheckboxProps | Get Checkbox or Radio props | Function(record) | - | 4.0 |
-| hideDefaultSelections | Remove the default `Select All` and `Select Invert` selections when [custom selection](#components-table-demo-row-selection-custom) | boolean | `false` | 4.0 |
+| hideSelectAll | Hide the selectAll checkbox and custom selection | boolean | `false` | 4.2 |
 | renderCell | Renderer of the table cell. Same as `render` in column | Function(checked, record, index, originNode) {} | - | 4.1 |
 | selectedRowKeys | Controlled selected row keys | string\[]\|number[] | \[] | 4.0 |
 | selections | Custom selection [config](#rowSelection), only displays default selections when set to `true` | object\[]\|boolean | - | 4.0 |

diff --git a/components/table/index.zh-CN.md b/components/table/index.zh-CN.md
@@ -193,7 +193,7 @@ const columns = [
 | columnTitle | 自定义列表选择框标题 | string\|React.ReactNode | - | 4.0 |
 | fixed | 把选择框列固定在左边 | boolean | - | 4.0 |
 | getCheckboxProps | 选择框的默认属性配置 | Function(record) | - | 4.0 |
-| hideDefaultSelections | [自定义选择项](#components-table-demo-row-selection-custom)时去掉『全选』『反选』两个默认选项 | boolean | false | 4.0 |
+| hideSelectAll | 隐藏全选勾选框与自定义选择项 | boolean | false | 4.2 |
 | renderCell | 渲染勾选框，用法与 Column 的 `render` 相同 | Function(checked, record, index, originNode) {} | - | 4.1 |
 | selectedRowKeys | 指定选中项的 key 数组，需要和 onChange 进行配合 | string\[]\|number[] | \[] | 4.0 |
 | selections | 自定义选择项 [配置项](#selection), 设为 `true` 时使用默认选择项 | object\[]\|boolean | true | 4.0 |

diff --git a/components/table/interface.tsx b/components/table/interface.tsx
@@ -136,7 +136,7 @@ export interface TableRowSelection<T> {
   /** @deprecated This function is meaningless and should use `onChange` instead */
   onSelectInvert?: (selectedRowKeys: Key[]) => void;
   selections?: INTERNAL_SELECTION_ITEM[] | boolean;
-  hideDefaultSelections?: boolean;
+  hideSelectAll?: boolean;
   fixed?: boolean;
   columnWidth?: string | number;
   columnTitle?: string | React.ReactNode;

diff --git a/docs/react/migration-v4.en-US.md b/docs/react/migration-v4.en-US.md
@@ -54,6 +54,7 @@ This document will help you upgrade from antd `3.x` version to antd `4.x` versio
 - Removed the `body` attribute of Transfer. Please use `children` instead.
 - Removed the `lazy` attribute of Transfer, which did not really optimize the effect.
 - Removed `combobox` mode, please use `AutoComplete` instead.
+- Removed the `rowSelection.hideDefaultSelections` property of Table, please use `SELECTION_ALL` and `SELECTION_INVERT` in `rowSelection.selections` instead, [Custom Selection](/components/table/#components-table-demo-row-selection-custom).
 
 #### Icon upgrade
 

diff --git a/docs/react/migration-v4.zh-CN.md b/docs/react/migration-v4.zh-CN.md
@@ -54,6 +54,7 @@ title: 从 v3 到 v4
 - 移除了 Transfer 的 `body` 属性，请使用 `children` 替代。
 - 移除了 Transfer 的 `lazy` 属性，它并没有起到真正的优化效果。
 - 移除了 Select 的 `combobox` 模式，请使用 `AutoComplete` 替代。
+- 移除了 Table 的 `rowSelection.hideDefaultSelections` 属性，请在 `rowSelection.selections` 中使用 `SELECTION_ALL` 和 `SELECTION_INVERT` 替代，[自定义选择项](/components/table/#components-table-demo-row-selection-custom)。
 
 #### 图标升级