fix(data-table): on-update-checked-row-keys will pass row data, closes

#2215, closes #2265
tusen-ai · Jun 19, 2022 · 0a7181a · 0a7181a
1 parent fc7133d
commit 0a7181a
Show file tree

Hide file tree

Showing 6 changed files with 21 additions and 6 deletions.
diff --git a/CHANGELOG.en-US.md b/CHANGELOG.en-US.md
@@ -15,6 +15,7 @@
 - Exports `NTooltipInst` type.
 - `n-data-table` adds `render-cell` prop, closes [#3095](https://github.com/TuSimple/naive-ui/issues/3095).
 - `n-space` adds `wrap-item` prop.
+- `n-data-table`'s `on-update-checked-row-keys` will pass row data, closes [#2215](https://github.com/TuSimple/naive-ui/issues/2215), closes [#2265](https://github.com/TuSimple/naive-ui/pull/2265)
 
 ## 2.30.4
 

diff --git a/CHANGELOG.zh-CN.md b/CHANGELOG.zh-CN.md
@@ -15,6 +15,7 @@
 - 导出 `NTooltipInst` 类型
 - `n-data-table` 新增 `render-cell` 属性，关闭 [#3095](https://github.com/TuSimple/naive-ui/issues/3095)
 - `n-space` 新增 `wrap-item` 属性
+- `n-data-table` 的 `on-update-checked-row-keys` 会传出行数据，关闭 [#2215](https://github.com/TuSimple/naive-ui/issues/2215)，关闭 [#2265](https://github.com/TuSimple/naive-ui/pull/2265)
 
 ## 2.30.4
 

diff --git a/src/data-table/demos/enUS/index.demo-entry.md b/src/data-table/demos/enUS/index.demo-entry.md
@@ -90,7 +90,7 @@ render-cell.vue
 | virtual-scroll | `boolean` | `false` | Whether to use virtual scroll to deal with large data. Make sure `max-height` is set before using it. When `virtual-scroll` is `true`, `rowSpan` will not take effect. |  |
 | on-load | `(rowData: object) => Promise<void>` | `undefined` | Callback of async tree data expanding. | 2.27.0 |
 | on-scroll | `(e: Event) => void` | `undefined` | Callback of table body scrolling. | 2.29.1 |
-| on-update:checked-row-keys | `(keys: Array<string \| number>) => void` | `undefined` | The callback function triggered when the checked-row-keys value changes. |  |
+| on-update:checked-row-keys | `(keys: Array<string \| number>, rows: object[]) => void` | `undefined` | The callback function triggered when the checked-row-keys value changes. |  |
 | on-update:expanded-row-keys | `(keys: Array<string \| number>) => void` | `undefined` | The callback function triggered when the expanded-row-keys value changes. |  |
 | on-update:filters | `(filters: DataTableFilterState, initiatorColumn: DataTableBaseColumn)` | `undefined` | The callback function triggered when the filters data changes. |  |
 | on-update:page | `(page: number)` | `undefined` | Callback function triggered when the page changes. |  |

diff --git a/src/data-table/demos/zhCN/index.demo-entry.md b/src/data-table/demos/zhCN/index.demo-entry.md
@@ -95,7 +95,7 @@ keep-alive-debug.vue
 | virtual-scroll | `boolean` | `false` | 是否开启虚拟滚动，应对大规模数据，开启前请设定好 `max-height`。当 `virtual-scroll` 为 `true` 时，`rowSpan` 将不生效 |  |
 | on-load | `(rowData: object) => Promise<void>` | `undefined` | 异步展开树形数据的回调 | 2.27.0 |
 | on-scroll | `(e: Event) => void` | `undefined` | 表格主体滚动的回调 | 2.29.1 |
-| on-update:checked-row-keys | `(keys: Array<string \| number>) => void` | `undefined` | checked-row-keys 值改变时触发的回调函数 |  |
+| on-update:checked-row-keys | `(keys: Array<string \| number>, rows: object[]) => void` | `undefined` | checked-row-keys 值改变时触发的回调函数 |  |
 | on-update:expanded-row-keys | `(keys: Array<string \| number>) => void` | `undefined` | expanded-row-keys 值改变时触发的回调函数 |  |
 | on-update:filters | `(filters: DataTableFilterState, initiatorColumn: DataTableBaseColumn)` | `undefined` | filters 数据改变时触发的回调函数 |
 | on-update:page | `(page: number)` | `undefined` | page 改变时触发的回调函数 |  |

diff --git a/src/data-table/src/interface.ts b/src/data-table/src/interface.ts
@@ -259,7 +259,11 @@ export type RenderSorterIcon = RenderSorter
 export type RenderFilterMenu = (actions: { hide: () => void }) => VNodeChild
 
 export type OnUpdateExpandedRowKeys = (keys: RowKey[]) => void
-export type OnUpdateCheckedRowKeys = (keys: RowKey[]) => void
+export type OnUpdateCheckedRowKeys = (
+  keys: RowKey[],
+  row: InternalRowData[]
+) => void
+
 // `null` only occurs when clearSorter is called
 export type OnUpdateSorter = (sortState: SortState & SortState[] & null) => void
 export type OnUpdateSorterImpl = (

diff --git a/src/data-table/src/use-check.ts b/src/data-table/src/use-check.ts
@@ -84,9 +84,18 @@ export function useCheck (
       onUpdateCheckedRowKeys,
       onCheckedRowKeysChange
     } = props
-    if (_onUpdateCheckedRowKeys) call(_onUpdateCheckedRowKeys, keys)
-    if (onUpdateCheckedRowKeys) call(onUpdateCheckedRowKeys, keys)
-    if (onCheckedRowKeysChange) call(onCheckedRowKeysChange, keys)
+    const rows: InternalRowData[] = []
+    const {
+      value: { getNode }
+    } = treeMateRef
+    keys.forEach((key) => {
+      const row = getNode(key)?.rawNode
+      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+      rows.push(row!)
+    })
+    if (_onUpdateCheckedRowKeys) call(_onUpdateCheckedRowKeys, keys, rows)
+    if (onUpdateCheckedRowKeys) call(onUpdateCheckedRowKeys, keys, rows)
+    if (onCheckedRowKeysChange) call(onCheckedRowKeysChange, keys, rows)
     uncontrolledCheckedRowKeysRef.value = keys
   }
   function doCheck (rowKey: RowKey | RowKey[]): void {