diff --git a/packages/core/client/src/modules/blocks/data-blocks/table/hooks/useTableBlockProps.tsx b/packages/core/client/src/modules/blocks/data-blocks/table/hooks/useTableBlockProps.tsx index f3401c82d6..ccaf07d281 100644 --- a/packages/core/client/src/modules/blocks/data-blocks/table/hooks/useTableBlockProps.tsx +++ b/packages/core/client/src/modules/blocks/data-blocks/table/hooks/useTableBlockProps.tsx @@ -10,7 +10,7 @@ import { ArrayField } from '@formily/core'; import { useField, useFieldSchema } from '@formily/react'; import { isEqual } from 'lodash'; -import { useCallback, useEffect, useRef } from 'react'; +import { useCallback, useEffect, useMemo, useRef } from 'react'; import { useTableBlockContext } from '../../../../../block-provider/TableBlockProvider'; import { findFilterTargets } from '../../../../../block-provider/hooks'; import { DataBlock, useFilterBlock } from '../../../../../filter-provider/FilterProvider'; @@ -26,12 +26,20 @@ export const useTableBlockProps = () => { const ctxRef = useRef(null); ctxRef.current = ctx; + const meta = ctx?.service?.data?.meta || {}; + const pagination = useMemo( + () => ({ + pageSize: meta?.pageSize, + total: meta?.count, + current: meta?.page, + }), + [meta?.count, meta?.page, meta?.pageSize], + ); useEffect(() => { if (!isLoading) { const serviceResponse = ctx?.service?.data; const data = serviceResponse?.data || []; - const meta = serviceResponse?.meta || {}; const selectedRowKeys = ctx?.field?.data?.selectedRowKeys; if (!isEqual(field.value, data)) { @@ -44,12 +52,9 @@ export const useTableBlockProps = () => { field.data.selectedRowKeys = selectedRowKeys; } - field.componentProps.pagination = field.componentProps.pagination || {}; - field.componentProps.pagination.pageSize = meta?.pageSize; - field.componentProps.pagination.total = meta?.count; - field.componentProps.pagination.current = meta?.page; + field.componentProps.pagination = pagination; } - }, [field, ctx?.service?.data, isLoading, ctx?.field?.data?.selectedRowKeys]); + }, [field, ctx?.service?.data, isLoading, ctx?.field?.data?.selectedRowKeys, pagination]); return { defaultDataSource: ctx?.service?.data?.data || [], @@ -59,7 +64,7 @@ export const useTableBlockProps = () => { showIndex: ctx.showIndex, dragSort: ctx.dragSort && ctx.dragSortBy, rowKey: ctx.rowKey || fieldSchema?.['x-component-props']?.rowKey || 'id', - pagination: fieldSchema?.['x-component-props']?.pagination === false ? false : field.componentProps.pagination, + pagination: fieldSchema?.['x-component-props']?.pagination === false ? false : pagination, onRowSelectionChange: useCallback((selectedRowKeys, selectedRowData) => { ctx.field.data = ctx?.field?.data || {}; ctx.field.data.selectedRowKeys = selectedRowKeys; diff --git a/packages/core/client/src/schema-component/antd/table-v2/Table.tsx b/packages/core/client/src/schema-component/antd/table-v2/Table.tsx index d84872b3a6..463a40722d 100644 --- a/packages/core/client/src/schema-component/antd/table-v2/Table.tsx +++ b/packages/core/client/src/schema-component/antd/table-v2/Table.tsx @@ -308,14 +308,19 @@ const usePaginationProps = (pagination1, pagination2) => { }, [t, totalCount], ); + + const showTotalResult = useMemo(() => { + return { + pageSizeOptions, + showTotal, + showSizeChanger: true, + ...pagination, + }; + }, [pagination, showTotal]); + const result = useMemo(() => { if (totalCount) { - return { - pageSizeOptions, - showTotal, - showSizeChanger: true, - ...pagination, - }; + return showTotalResult; } else { return { pageSizeOptions, @@ -351,7 +356,7 @@ const usePaginationProps = (pagination1, pagination2) => { }, }; } - }, [pagination, t, showTotal, field.value?.length]); + }, [pagination, t, showTotal, field.value?.length, showTotalResult]); if (pagination2 === false) { return false;