1.引入ant的 Table

import { Table, Space, Button, message } from 'antd';

2.获得接口的数据的时候增加上创建时间

 const response = await axios.get(`${Config.BASE_URL}/api/v1/calculation_plans?token=${getToken()}`);if (response.data.message === 'ok') {const data = response.data.data.map((item) => ({key: item.id,id: item.id,name: item.name,industry: '-',start_year: item.start_year,created_at: item.created_at, // 增加创建时间end_year: item.end_year,calculation_template_name: item.calculation_templates.name,year_range: `${item.start_year} - ${item.end_year}`,}));

3.对接口的数据进行处理

95       {96         title: '创建时间',97         dataIndex: 'created_at',98         key: 'created_at',99       },

这样会显示数据：

2023-07-24T15:10:38.820628+08:00

需要修改为北京时间：

最后做出这样的修改：(显示为北京时间：2023/7/24 15:10:38）

 

import { Table } from 'antd';const dataSource = [// 数据源];const columns = [// 其他列配置{title: '创建时间',dataIndex: 'created_at',key: 'created_at',render: (text) => moment(text).format('YYYY-MM-DD HH:mm:ss'),},];const MyTable = () => {return <Table dataSource={dataSource} columns={columns} />;};