如何使用 luxon (DateTimeNow) 和 ReactJs 正确 map/filter 数据

Question

我想解释一下我今天遇到的问题。

我有一个数组，看起来像这样

[{status: "closed",createdAt: "2022-01-13T15:28:25.239Z"},{status: "closed",createdAt: "2022-01-10T15:28:25.239Z"},{status: "open",createdAt: "2021-11-25T15:28:25.239Z"}]

我过滤以仅检索状态为“已关闭”的数据

const countData = data?.filter(
    (item) => item.status === "closed"
);
const count = countData?.length;

这很好用，它正确地 returns 给我的号码。

我想用 Luxon 添加一个新过滤器。

我想用luxon取今天的日期，结果显示这个日期对应的对象

const dateNow = DateTime.now().toISO();
console.log(dateNow) 
2022-01-13T16:23:44.873+01:00

我该如何解决这个问题？

Answer 1

Luxon 有一个函数，可以让您在参数的特定点获取日期，该函数称为 startOf。所以你可以这样做：

const todayDate = DateTime.now().startOf("day");

因此您的 todayDate 变量将是您当前的日期，但在 00:00:00 时间。

并且您可以在过滤函数期间对元素日期进行转换，以便将它们与 todayDate 进行比较，如下所示：

//Please consider that the example for today was at 2022-01-13
const array = [
  { 
    name: "this is for today", 
    date: "2022-01-13T15:28:25.239Z" 
  }, 
  { 
    name: "this was for yesterday", 
    date: "2022-01-12T15:28:25.239Z" 
  }];

const todayDate = DateTime.now().startOf("day");

const todayElements = array.filter((element) => {
  return DateTime.fromISO(element.date).startOf("day").equals(todayDate);
});

Answer 2

如果你想检查给定的 Luxon DateTime 对象是否代表今天的同一天，你可以使用 hasSame 传递 date 作为第二个参数

Return whether this DateTime is in the same unit of time as another DateTime. Higher-order units must also be identical for this function to return true. Note that time zones are ignored in this comparison, which compares the local calendar time. Use DateTime#setZone to convert one of the dates if needed.

在您的情况下，您可以使用类似以下代码的内容：

const DateTime = luxon.DateTime;
const input = [{
  status: "closed",
  createdAt: "2022-01-13T15:28:25.239Z"
}, {
  status: "closed",
  createdAt: "2022-01-10T15:28:25.239Z"
}, {
  status: "open",
  createdAt: "2021-11-25T15:28:25.239Z"
}, {
  status: "closed",
  createdAt: new Date().toISOString()
}];

const todayItems = input.filter(item => {
  return DateTime.fromISO(item.createdAt).hasSame(DateTime.now(), 'day') && item.status == "closed";
});
console.log(todayItems)

<script src="https://cdn.jsdelivr.net/npm/luxon@2.3.0/build/global/luxon.js"></script>

如何使用 luxon (DateTimeNow) 和 ReactJs 正确 map/filter 数据

How to map/filter data correctly with luxon (DateTimeNow) and ReactJs

date

filter

reactjs

luxon