feat: add cacheOption

hemengke1997 · Jan 5, 2022 · da9a659 · da9a659
1 parent e046d83
commit da9a659
Show file tree

Hide file tree

Showing 7 changed files with 441 additions and 237 deletions.
diff --git a/example/package.json b/example/package.json
@@ -6,8 +6,8 @@
     "serve": "vite preview"
   },
   "dependencies": {
-    "@ant-design/pro-table": "^2.43.4",
-    "antd": "^4.16.6",
+    "@ant-design/pro-table": "^2.61.9",
+    "antd": "^4.18.2",
     "react": "^17.0.0",
     "react-dom": "^17.0.0",
     "use-antd-resizable-header": "link:.."

diff --git a/example/src/App.tsx b/example/src/App.tsx
@@ -6,15 +6,17 @@ import useARH from 'use-antd-resizable-header';
 import 'use-antd-resizable-header/dist/style.css';
 import 'antd/es/table/style/index.css';
 import { useReducer } from 'react';
-import { useEffect } from 'react';
 import { useMemo } from 'react';
+import { useEffect } from 'react';
 
 const data: any[] = [];
 for (let i = 0; i < 100; i++) {
   data.push({
     key: i,
     name: `Edrward ${i}`,
     age: 32,
+    x: i,
+    y: i,
     address: `London Park no. ${i}`,
   });
 }
@@ -36,6 +38,18 @@ function App() {
       dataIndex: 'age',
       key: 'age',
     },
+    {
+      title: 'x',
+      width: 100,
+      dataIndex: 'x',
+      key: 'x',
+    },
+    {
+      title: 'y',
+      width: 100,
+      dataIndex: 'y',
+      key: 'y',
+    },
     {
       title: 'Column 1',
       dataIndex: 'address',
@@ -59,27 +73,21 @@ function App() {
     },
   ];
 
-  useEffect(() => {
-    console.log('x', x);
-  }, [x]);
-
-
-  const { components, resizableColumns, tableWidth } = useARH({ columns: useMemo(()=>columns, [x]) });
+  const { components, resizableColumns, tableWidth } = useARH({ columns: useMemo(() => columns, [x]) });
 
   const {
     components: proComponents,
     resizableColumns: proResizableColumns,
     tableWidth: proTableWidth,
   } = useARH({ columns: useMemo(() => columns, [x]) });
 
+  useEffect(() => {
+    console.log(proTableWidth, 'proTableWidth');
+  }, [proTableWidth]);
+
   return (
     <div className="App">
-      <Table
-        columns={resizableColumns}
-        components={components}
-        dataSource={data}
-        scroll={{ x: tableWidth }}
-      ></Table>
+      <Table columns={resizableColumns} components={components} dataSource={data} scroll={{ x: tableWidth }}></Table>
 
       <ProTable
         columns={proResizableColumns}