fix: DIYTable 渲染问题修复

src/components/DDComponents/DIYTable/index.tsx

@@ -30,22 +30,15 @@ function DIYTable(props: IProps) {
 
   // table数据
   const [tableData, setTableData] = useState<TableDataType[]>([{ index: 1 }]);
-  // table 列配置
-  const [tableColumnDef, setTableColumnDef] = useState<ColumnsType<any>>([
+
+  // table列配置
+  const tableColumnDef = [
     {
       title: '序号',
       dataIndex: 'index',
       className: 'hidden',
     },
-  ]);
-
-  // const tableColumnDef: ColumnsType<any> = [
-  // {
-  //   title: '序号',
-  //   dataIndex: 'index',
-  //   className: 'hidden',
-  // },
-  // ];
+  ];
 
   // 表单填写时的表格生成
   const handleGenerateTable = () => {
@@ -146,39 +139,21 @@ function DIYTable(props: IProps) {
   };
 
   // 当仅用作展示时
-  const handleDisplayOnly = () => {
+  const displayColumnDef = () => {
     const rows = columns;
-    const newTableData = [];
-    const newTableColumnDef = [
-      {
-        title: '序号',
-        dataIndex: 'index',
-        className: 'hidden',
-      },
-    ];
-    if (rows && columns.length) {
+    if (rows && rows.length) {
       for (let index = 0; index < rows.length; index++) {
         // 把每一行的数据提出来到一个对象里
         if (rows) {
           const row = rows[index];
-
           if (index === 0) {
             // 列配置
             row.forEach((col: any) => {
-              newTableColumnDef.push({ title: col.name, dataIndex: col.type, className: '' });
+              tableColumnDef.push({ title: col.name, dataIndex: col.type, className: '' });
             });
           }
-          const rowData: any = {};
-          row.forEach((col: any) => {
-            rowData.index = index + 1;
-            rowData[col.type] = col.value[0];
-            rowData.key = col.id + index;
-          });
-          newTableData.push(rowData);
         }
       }
-      setTableColumnDef(newTableColumnDef);
-      setTableData(newTableData);
     }
   };
 
@@ -188,14 +163,40 @@ function DIYTable(props: IProps) {
 
   if (!displayOnly) {
     handleGenerateTable();
+  } else {
+    displayColumnDef();
   }
 
   useEffect(() => {
-    if (!displayOnly) {
+    if (columns.length === 0) {
       return;
     }
-    handleDisplayOnly();
-  }, []);
+    const rows = columns;
+    const newTableData = [];
+    if (rows && rows.length) {
+      if (displayOnly) {
+        for (let index = 0; index < rows.length; index++) {
+          // 把每一行的数据提出来到一个对象里
+          const row = rows[index];
+          const rowData: any = {};
+          if (displayOnly) {
+            row.forEach((col: any) => {
+              rowData.index = index + 1;
+              // eslint-disable-next-line prefer-destructuring
+              rowData[col.type] = col.value[0];
+              rowData.key = col.id + index;
+            });
+            newTableData.push(rowData);
+          }
+        }
+      } else {
+        newTableData.push({
+          index: 1,
+        });
+      }
+      setTableData(newTableData);
+    }
+  }, [columns]);
 
   return (
     <>

src/pages/Detail/CommitAuditModal.js

@@ -64,7 +64,6 @@ function CommitAuditModal(props) {
     projectList,
     OSSData,
   } = props;
-
   const [auditId, setAuditId] = useState();
   const [data, setData] = useState([]);
   const [length, setLength] = useState(1);
@@ -85,7 +84,6 @@ function CommitAuditModal(props) {
   const formValueRef = useRef({
     form: [],
   });
-
   function getDataValue(item) {
     let arr = [];
     arr.push(item.value);