格式化日期以更正React中的日期格式

Question

我目前正在使用 React Kendo Grid，它通过 API 填充数据。其中一列是日期，填充的数据格式如下：

2022-02-11T15:50:51.000+00:00   

我尝试像这样设置 Kendo Grid 列的格式：

 <GridColumn
                field="snDate"
                filter="date"
                format="{0:yyyy-MM-dd'T'HH:mm:ss.SSS'Z'}"
                width="200px"
                title="Date" 
              />

但是当我使用 Kendo datapicker 过滤器过滤它时，它不返回任何行。我做错了什么？

Answer 1

您需要制作一个自定义列组件并在那里使用日期：

const DateCell = ({ myDate }) => { 
  const [year, month, day] = myDate.split('T')[0].split('-');
  const time_part = myDate.split('T')[1];

  return (
        <td>
            {`${year}/${month}/${day} ${time_part}`}
        </td>
    )
}
//export default DateCell //this is if you want to put it in separate component



<GridColumn
   field="snDate"
   filter="date"
   width="200px"
   title="Date" 
   cell={DateCell}
/>

我的结果是 -> 2022/06/19 10:35:13.197

当您过滤它时，React Kendo Grid 知道每个单元格的值采用您提到的第一种格式，我的意思是

2022-02-11T15:50:51.000+00:00

，并且过滤器将起作用。 这对我有用。
祝你好运