生成antd的Table表列定义信息:CREATE TABLE sys_config ( con_id varchar(64) NOT NULL COMMENT 'ID', con_name varchar(128) DEFAULT NULL COMMENT '参数名称', con_value varchar(128) DEFAULT NULL COMMENT '参数值', con_group varchar(128) DEFAULT NULL COMMENT '所属组', con_parent_id varchar(64) DEFAULT NULL COMMENT '父级ID', con_type enum('DIR','DATA') DEFAULT NULL COMMENT '参数类型(DATA:数据,DIR 目录)', con_create_date datetime DEFAULT NULL COMMENT '创建日期', con_update_date datetime DEFAULT NULL COMMENT '更新日期', con_manager varchar(64) DEFAULT NULL COMMENT '用户', con_species varchar(64) DEFAULT NULL COMMENT '种属', con_order int(10) DEFAULT NULL COMMENT '排序', con_state enum('OFF','ON') DEFAULT NULL COMMENT '状态( ON 启用 , OFF 注销 )', con_remark varchar(128) DEFAULT NULL COMMENT '描述', PRIMARY KEY (con_id), KEY CON_GROUP (con_group), KEY CON_PARENT_ID (con_parent_id), CONSTRAINT sys_config_ibfk_1 FOREIGN KEY (con_parent_id) REFERENCES sys_config (con_id) ON DELETE CASCADE ) ENGINE=InnoDB DEFAULT CHARSET=utf8
时间: 2023-12-29 21:06:49 浏览: 92
解决elementUI 切换tab后 el_table 固定列下方多了一条线问题
在Ant Design中,Table组件的列定义是通过columns属性传递的。因此,可以通过解析CREATE TABLE语句中的列信息来生成Ant Design的Table表列定义信息。以下是Ant Design Table组件的示例代码:
```jsx
import { Table } from 'antd';
const columns = [
{
title: 'ID',
dataIndex: 'con_id',
key: 'con_id',
},
{
title: '参数名称',
dataIndex: 'con_name',
key: 'con_name',
},
{
title: '参数值',
dataIndex: 'con_value',
key: 'con_value',
},
{
title: '所属组',
dataIndex: 'con_group',
key: 'con_group',
},
{
title: '父级ID',
dataIndex: 'con_parent_id',
key: 'con_parent_id',
},
{
title: '参数类型',
dataIndex: 'con_type',
key: 'con_type',
},
{
title: '创建日期',
dataIndex: 'con_create_date',
key: 'con_create_date',
},
{
title: '更新日期',
dataIndex: 'con_update_date',
key: 'con_update_date',
},
{
title: '用户',
dataIndex: 'con_manager',
key: 'con_manager',
},
{
title: '种属',
dataIndex: 'con_species',
key: 'con_species',
},
{
title: '排序',
dataIndex: 'con_order',
key: 'con_order',
},
{
title: '状态',
dataIndex: 'con_state',
key: 'con_state',
},
{
title: '描述',
dataIndex: 'con_remark',
key: 'con_remark',
},
];
const data = [
// 数据数组
];
const ExampleTable = () => {
return <Table columns={columns} dataSource={data} />;
};
```
其中,columns数组中的每个元素代表了一列的定义,包括title(列名)、dataIndex(对应数据项的字段名)和key(唯一标识)。在这个示例中,我们将每个列的title、dataIndex和key属性分别设置为了对应的字段名。
需要注意的是,在生成Ant Design Table表列定义信息时,需要根据数据表中每个字段的类型和约束信息进行适当的转换,以确保生成的表格组件能够正确地显示和编辑数据。
阅读全文