فهرست منبع

fix(table): fix `pagination` props working

修复table的pagination属性无法动态设置数据的问题
无木 3 سال پیش
والد
کامیت
e32789373e
2فایلهای تغییر یافته به همراه12 افزوده شده و 1 حذف شده
  1. 1 0
      CHANGELOG.zh_CN.md
  2. 11 1
      src/components/Table/src/hooks/usePagination.tsx

+ 1 - 0
CHANGELOG.zh_CN.md

@@ -11,6 +11,7 @@
 - **BasicTable**
   - 修复全屏模式下看不到子组件弹出层(popconfirm 以及 select、treeSelect 等编辑组件)的问题
   - 修复启用`expandRowByClick`时,点击不可展开的行可能会导致样式错误的问题
+  - 修复`pagination`属性动态改变不生效的问题
 - **Dark Theme** 黑暗主题下的配色问题修正
   - 修复`Tree`组件被选中节点的背景颜色
   - 修复`Alert`组件的颜色配置

+ 11 - 1
src/components/Table/src/hooks/usePagination.tsx

@@ -1,6 +1,6 @@
 import type { PaginationProps } from '../types/pagination';
 import type { BasicTableProps } from '../types/table';
-import { computed, unref, ref, ComputedRef } from 'vue';
+import { computed, unref, ref, ComputedRef, watchEffect } from 'vue';
 import { LeftOutlined, RightOutlined } from '@ant-design/icons-vue';
 import { isBoolean } from '/@/utils/is';
 import { PAGE_SIZE, PAGE_SIZE_OPTIONS } from '../const';
@@ -27,6 +27,16 @@ export function usePagination(refProps: ComputedRef<BasicTableProps>) {
   const configRef = ref<PaginationProps>({});
   const show = ref(true);
 
+  watchEffect(() => {
+    const { pagination } = unref(refProps);
+    if (!isBoolean(pagination) && pagination) {
+      configRef.value = {
+        ...unref(configRef),
+        ...(pagination ?? {}),
+      };
+    }
+  });
+
   const getPaginationInfo = computed((): PaginationProps | boolean => {
     const { pagination } = unref(refProps);