解决多表格三元表达式组件不刷新列问题

src/components/Common/Table/index.jsx

@@ -302,8 +302,8 @@ const SageTable = React.forwardRef((props, ref) => {
     setColumns(columnsTemp);
   }, [columnsProps, tableState, allColumns]);
 
+
   useEffect(() => {
-    queryTable();
     const columnsTemp = columnsProps ? columnsProps.slice() : []
     const hiddenIndex = []
     columnsTemp.forEach((item, index) => {
@@ -313,6 +313,12 @@ const SageTable = React.forwardRef((props, ref) => {
     })
     setDefaultColumnIndex(hiddenIndex);
     setAllColumns(columnsTemp);
+  }, [columnsProps])
+
+
+  useEffect(() => {
+    queryTable();
+    
   }, []);
 
   const tableSearchFormProps = {

src/pages/demo/moretable/index.jsx

 import React, { useState, useEffect, useRef } from 'react'
+import { Table } from 'antd'
 import { PageHeaderWrapper } from '@ant-design/pro-layout'
 import { SageTable, SageModal, SageButton, SageMessage, ActionSet, SageLayoutLR } from '@/components/Common'
 import { PlusOutlined, EditOutlined, DeleteOutlined, VerticalAlignBottomOutlined, VerticalAlignTopOutlined } from '@ant-design/icons';
@@ -277,10 +278,36 @@ const CrudList = () => {
     // toolOptionConfig: ['reload', 'hiddensearch', 'density', 'fullScreen']
   }
 
+  const changeStatus = (value) => {
+    setStatus(value)
+  }
+
   return (
     <PageHeaderWrapper>
+      <SageButton onClick={() => changeStatus('add')}>按钮1</SageButton>
+      <SageButton onClick={() => changeStatus('update')}>按钮2</SageButton>
+      {
+        status === '' ?
+          null : status === 'add' ?
+            <SageTable
+              ref={tableRef1}
+              rowKey='id'
+              // hasNumber
+              // hasCheck
+              columns={columns1}
+              //request={(params) => queryCrud(params)}
+            /> : status === 'update' ?
+              <SageTable
+                ref={tableRef2}
+                rowKey='id'
+                // hasNumber
+                // hasCheck
+                columns={columns2}
+                // request={(params) => queryCrud(params)}
+              /> : null
+      }
 
-      <div style={{display: 'flex'}}>
+      {/* <div style={{display: 'flex'}}>
         <div style={{flex: 1, width: '50%'}}>
           <SageTable
             ref={tableRef1}
@@ -299,7 +326,7 @@ const CrudList = () => {
             request={(params) => queryCrud(params)}
           />
         </div>
-      </div>
+      </div> */}
 
     </PageHeaderWrapper>
   )