fix(table): 移除非必要的分页监听 (#3046)

* fix(table): pagination * fix: lint error
Tencent · Jan 19, 2024 · c2f4dc4 · c2f4dc4
1 parent 5b95d8c
commit c2f4dc4
Show file tree

Hide file tree

Showing 5 changed files with 9 additions and 27 deletions.
diff --git a/src/table/_example/expandable.vue b/src/table/_example/expandable.vue
@@ -34,6 +34,7 @@
       table-layout="auto"
       tableContentWidth="1200"
       lazyLoad
+      resizable
       @expand-change="rehandleExpandChange"
     >
       <template #operation="{ row }">

diff --git a/src/table/_example/filter-controlled.vue b/src/table/_example/filter-controlled.vue
@@ -172,7 +172,6 @@ export default {
           sorter: true,
           // 自定义过滤组件：日期过滤配置，请确保自定义组件包含 value 和 onChange 属性
           filter: {
-            type: 'custom',
             component: DateRangePickerPanel,
             props: {
               firstDayOfWeek: 7,

diff --git a/src/table/hooks/usePagination.tsx b/src/table/hooks/usePagination.tsx
@@ -105,17 +105,15 @@ export default function usePagination(props: TdBaseTableProps, context: SetupCon
 
   // eslint-disable-next-line
   const renderPagination = (h: CreateElement) => {
-    if (!pagination.value) return null;
+    if (!innerPagination.value) return null;
     return (
       <div class={`${classPrefix.value}-table__pagination`}>
         <Pagination
-          {...{
-            props: pagination.value,
-            on: {
-              change: (pageInfo: PageInfo) => {
-                const dataSource = getDataSourceAndPaginate(pageInfo.current, pageInfo.pageSize);
-                setInnerPagination?.value?.({ ...innerPagination.value, ...pageInfo }, dataSource);
-              },
+          props={{ ...props.pagination, ...innerPagination.value }}
+          on={{
+            change: (pageInfo: PageInfo) => {
+              const dataSource = getDataSourceAndPaginate(pageInfo.current, pageInfo.pageSize);
+              setInnerPagination?.value?.({ ...innerPagination.value, ...pageInfo }, dataSource);
             },
           }}
           scopedSlots={{ totalContent: context.slots.totalContent }}

diff --git a/src/table/hooks/useRowSelect.tsx b/src/table/hooks/useRowSelect.tsx
@@ -1,6 +1,6 @@
 // 行选中相关功能：单选 + 多选
 import {
-  computed, toRefs, h, ref, watch, Ref,
+  computed, toRefs, h, ref, watch,
 } from '@vue/composition-api';
 import intersection from 'lodash/intersection';
 import get from 'lodash/get';
@@ -20,12 +20,10 @@ import Checkbox from '../../checkbox';
 import Radio from '../../radio';
 import { ClassName } from '../../common';
 import log from '../../_common/js/log';
-import { PaginationProps } from '../../pagination';
 
 export default function useRowSelect(
   props: TdPrimaryTableProps,
   tableSelectedClasses: TableClassName['tableSelectedClasses'],
-  pagination: Ref<PaginationProps>,
 ) {
   const {
     selectedRowKeys, columns, data, rowKey, reserveSelectedRowOnPaginate,
@@ -57,20 +55,6 @@ export default function useRowSelect(
     return singleSelectCol.checkProps.allowUncheck;
   });
 
-  watch(
-    [data, pagination, reserveSelectedRowOnPaginate],
-    () => {
-      if (reserveSelectedRowOnPaginate.value) return;
-      const {
-        pageSize, current, defaultPageSize, defaultCurrent,
-      } = pagination.value;
-      const tPageSize = pageSize || defaultPageSize;
-      const tCurrent = current || defaultCurrent;
-      currentPaginateData.value = data.value.slice(tPageSize * (tCurrent - 1), tPageSize * tCurrent);
-    },
-    { immediate: true },
-  );
-
   watch(
     [data, columns, tSelectedRowKeys, selectColumn, rowKey],
     () => {

diff --git a/src/table/primary-table.tsx b/src/table/primary-table.tsx
@@ -95,7 +95,7 @@ export default defineComponent({
       formatToRowSelectColumn,
       setTSelectedRowKeys,
       onInnerSelectRowClick,
-    } = useRowSelect(props, tableSelectedClasses, dataPagination);
+    } = useRowSelect(props, tableSelectedClasses);
     // 过滤功能
     const {
       hasEmptyCondition,