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)
文章来源:https://www.toymoban.com/news/detail-632524.html
文章来源地址https://www.toymoban.com/news/detail-632524.html
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} />;
};
到了这里,关于react ant add/change created_at的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!