ant-design,解决格式化Table中的时间

使用React+Antd遇到的Table组件时间格式化的问题

我在开发react项目时使用antdUI进行开发,遇到了对时间格式化的问题,下面是我成功格式化的解决办法

在使用antd的时候要想修改table里面的内容需要用到render属性

修改前的图片

修改后的效果为：

// 格式化的方法
（根据需求造方法这样就不会造多个相似的方法造成代码臃肿，代码越简洁越好）

import moment from ‘moment’;  	// 这个moment方法。框架里本来就有引入就好

const formatterTime = (val) => {
	return val ? moment(val).format('YYYY-MM-DD HH:mm:ss') : ''
}

// columns的设置

const columns = [
      {
        title: 'Specialty Name',
        dataIndex: 'specialtyName'
      },
      {
        title: 'Create Time',
        dataIndex: 'createTime',
        render: this.formatterTime //在这里调用就可以实现时间格式化
      },
      {
        title: 'Modify Time',
        dataIndex: 'modifyTime',
        render: this.formatterTime
      },
      {
        title: 'Create Person',
        dataIndex: 'createPersonId'
      },
      {
        title: 'Last Modify Person',
        dataIndex: 'lastModifyPersonId'
      }
    ];

最后将columns放入Table组件中

<Table columns={columns} dataSource={specialtyList}/>

希望可以帮到你