fix: DIYTable控件仅显示时不渲染问题修复

src/components/DDComponents/DIYTable/index.tsx

@@ -27,20 +27,25 @@ interface TableDataType {
 
 function DIYTable(props: IProps) {
   const { table, columns, displayOnly, onChange } = props;
+
   // table数据
   const [tableData, setTableData] = useState<TableDataType[]>([{ index: 1 }]);
   // table 列配置
-  // const [tableColumnDef, setTableColumnDef] = useState<ColumnsType<any>>([
-  //
-  // ]);
-
-  const tableColumnDef: ColumnsType<any> = [
+  const [tableColumnDef, setTableColumnDef] = useState<ColumnsType<any>>([
     {
       title: '序号',
       dataIndex: 'index',
       className: 'hidden',
     },
-  ];
+  ]);
+
+  // const tableColumnDef: ColumnsType<any> = [
+  // {
+  //   title: '序号',
+  //   dataIndex: 'index',
+  //   className: 'hidden',
+  // },
+  // ];
 
   // 表单填写时的表格生成
   const handleGenerateTable = () => {
@@ -144,6 +149,13 @@ function DIYTable(props: IProps) {
   const handleDisplayOnly = () => {
     const rows = columns;
     const newTableData = [];
+    const newTableColumnDef = [
+      {
+        title: '序号',
+        dataIndex: 'index',
+        className: 'hidden',
+      },
+    ];
     if (rows && columns.length) {
       for (let index = 0; index < rows.length; index++) {
         // 把每一行的数据提出来到一个对象里
@@ -153,17 +165,19 @@ function DIYTable(props: IProps) {
           if (index === 0) {
             // 列配置
             row.forEach((col: any) => {
-              tableColumnDef.push({ title: col.name, dataIndex: col.type });
+              newTableColumnDef.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;
           });
-          tableColumnDef.push(rowData);
+          newTableData.push(rowData);
         }
       }
+      setTableColumnDef(newTableColumnDef);
       setTableData(newTableData);
     }
   };