فهرست منبع

fix: 修正columns使用useMemo可能会出现错误

xyhxx 2 سال پیش
والد
کامیت
3d220be8b4
1فایلهای تغییر یافته به همراه19 افزوده شده و 11 حذف شده
  1. 19 11
      packages/app/src/components/table/hooks.tsx

+ 19 - 11
packages/app/src/components/table/hooks.tsx

@@ -15,7 +15,7 @@ import {
   Dispatch,
   SetStateAction,
   useEffect,
-  useMemo,
+  useLayoutEffect,
   useRef,
   useState,
 } from 'react';
@@ -187,16 +187,24 @@ export function useTable<T extends Record<string, any>>(
     hasRenderSubComponent,
   } = options;
 
-  const {columnList, hasSort, hasGroup} = useMemo(
-    function() {
-      return parseColumn(
-        columns,
-        Boolean(setRowSelection),
-        true,
-      );
-    },
-    [columns, setRowSelection],
-  );
+  const [
+    {columnList, hasGroup, hasSort},
+    setColumns,
+  ] = useState<ReturnType<typeof parseColumn>>({
+    columnList: [],
+    hasSort: false,
+    hasGroup: false,
+  });
+
+  // 这里不能用useMemo优化 useMemo可能会在useEffect前调用
+  // table.getIsAllRowsSelected() 会报错
+  useLayoutEffect(function() {
+    setColumns(parseColumn(
+      columns,
+      Boolean(setRowSelection),
+      true,
+    ));
+  }, [columns, setRowSelection]);
 
   const preloadData = useContextSection(settingContext, state => state[0]);