next.js date-fns在使用isWithinInterval和用户时区比较日期时显示无效间隔

r7s23pms  于 2023-08-04  发布在  其他
关注(0)|答案(1)|浏览(113)

我从一个API中获取UTC时间,所以在我的下一个项目中,我将根据同样来自API的时区设置将UTC时间转换为用户的本地时间。
我尝试使用date-fnsisWithinInterval函数来检查当前时间(在用户所在的时区)是否在开始和结束时间之内,但它总是返回一个
invalid interval
在文件的顶部,我正在声明基于时区的当前时间;

const nowInUsersTimezone = new Date().toLocaleString('en-AU', { timeZone: user.timezone })

字符串
当我控制台记录这一点时,它显示完美。
当我开始使用isWithinInterval im使用下面的检查如果nowInUsersTimezone是在2个日期之间,如果是,那么我只是打印within,但我不能让它工作;

{
    isWithinInterval(
        parseISO(nowInUsersTimezone),
        {
            start: parseISO(formatInTimeZone(job.start_time, user.timezone, 'dd/MM/yyyy, h:mm:ss aaa')),
            end: parseISO(formatInTimeZone(job.end_time, user.timezone, 'dd/MM/yyyy, h:mm:ss aaa')),
        }
    ) && (
        <>
            <p>Within</p>
        </>
    )
}


控制台记录startend日期工作完美,只是当它在isWithinInterval不工作。

vddsk6oq

vddsk6oq1#

查看documentationdate-fns库中的isWithinInterval函数检查日期是否在给定的时间间隔内。它需要Date对象作为参数,而不是ISO字符串。
toLocaleString方法返回一个字符串,而不是Date对象,该字符串的格式取决于区域设置。
我建议使用parseISO和ISO字符串。但是带有时区转换的new Date()不会返回ISO字符串。这可能就是为什么你得到“无效的间隔”错误。

我会这样做

const now = new Date();
const nowInUsersTimezone = new Date(
  now.toLocaleString('en-AU', { timeZone: user.timezone })
);

const jobStart = new Date(
  job.start_time.toLocaleString('en-AU', { timeZone: user.timezone })
);
const jobEnd = new Date(
  job.end_time.toLocaleString('en-AU', { timeZone: user.timezone })
);

{
  isWithinInterval(nowInUsersTimezone, {
    start: jobStart,
    end: jobEnd,
  }) && (
    <>
      <p>Within</p>
    </>
  )
}

字符串

编辑:更改方法

听起来问题不在于isWithinInterval函数本身,而在于时间的比较。首先要检查开始时间是否早于结束时间,以及nowInUsersTimezone是否在这两个时间之间。

const user = {
  timezone: 'Australia/Sydney' //Example set
};

const job = {
  start_time: new Date('2023-07-29T00:00:00Z'), 
  end_time: new Date('2023-07-29T23:59:59Z'),
};

// create a new date object for the current time
const now = new Date();

// convert it to the user's timezone
const nowInUsersTimezone = new Date(now.toLocaleString('en-US', { timeZone: user.timezone }));

// convert job start and end times to the user's timezone
const jobStart = new Date(job.start_time.toLocaleString('en-US', { timeZone: user.timezone }));
const jobEnd = new Date(job.end_time.toLocaleString('en-US', { timeZone: user.timezone }));

// check the interval
if(isWithinInterval(nowInUsersTimezone, { start: jobStart, end: jobEnd })) {
    console.log("Within");
} else {
    console.log("Not within");
}

console.log("Now in user's timezone: ", nowInUsersTimezone);
console.log("Job start time in user's timezone: ", jobStart);
console.log("Job end time in user's timezone: ", jobEnd);

相关问题