Javascript 用于显示店铺是否已打开,如果未打开,则显示店铺何时打开的函数

Javascript 用于显示店铺是否已打开,如果未打开,则显示店铺何时打开的函数,javascript,reactjs,datetime,Javascript,Reactjs,Datetime,我正在尝试创建一个函数,该函数获取当前时间,并基于一个包含开放时间的数组,显示商店是打开还是关闭,以及何时关闭和打开 这是我的时间数组,它不能改变,我的意思是,时间可以改变,但总的来说,它的工作方式不会改变 { "openHours": [ { days: [1, 2, 3, 4, 5], from: '11:00', to: '22:00' }, { days: [6], from: '12:00', to: '23:

我正在尝试创建一个函数,该函数获取当前时间,并基于一个包含开放时间的数组,显示商店是打开还是关闭,以及何时关闭和打开

这是我的时间数组,它不能改变,我的意思是,时间可以改变,但总的来说,它的工作方式不会改变

{
"openHours": [
              { days: [1, 2, 3, 4, 5], from: '11:00', to: '22:00' },
              { days: [6], from: '12:00', to: '23:00' },
             ]
}
正如你所看到的,没有第0天,也就是星期天,因为那时商店关门了

我现在有这个

const [isOpen, setIsOpen] = useState(false);
const [opensAt, setOpensAt] = useState(false);
const [closesAt, setClosesAt] = useState(false);

const checkIfOpen = () => {
    const now = new Date();
    const openedHours = card.openHours.find(i => i.days.includes(now.getDay()));
    const nextDay = new Date(Date.now() + 3600 * 1000 * 24);
    const openedHoursNextDay = card.openHours.find(i => i.days.includes(nextDay.getDay()));

    if (openedHours) {
      const fromHours = new Date().setHours(...openedHours.from.split(':'));
      const toHours = new Date().setHours(...openedHours.to.split(':'));
      if (fromHours <= now.getTime() && now.getTime() <= toHours) {
        setIsOpen(true);
        setClosesAt(openedHours.to);
      } else if (now.getTime() > toHours) {
        setIsOpen(false);
        setOpensAt(openedHoursNextDay.from);
      } else {
        setIsOpen(false);
        setOpensAt(openedHours.from);
      }
    }
  };

return (
        <div className="info-text text-nowrap">
            {isOpen ? `Closed at ${closesAt}` : `Opens at ${opensAt}`}
        </div>
        <div className="info-text">{isOpen ? "Now open" : "Now closed"}</div>
);
所以我有个问题。如果第二天是星期天,openedHoursNextDay返回未定义的值,如何获得第二天有开放时间的值?

立即尝试

常量[isOpen,setIsOpen]=useStatefalse; const[closesAt,setClosesAt]=useStatefalse; const[opensAt,setOpensAt]=useStatefalse; 常量checkIfOpen==>{ const now=新日期; const openedHours=card.openHours.findi=>i.days.includeNow.getDay; const nextDay=new DateDate.now+3600*1000*24; const openedHoursNextDay=card.openHours.findi=>i.days.includesnextDay.getDay==0?1:nextDay.getDay; 如果开放时间{ const fromHours=new Date.setHours…openedHours.from.split':'; const toHours=new Date.setHours…openedHours.to.split':'; 如果这是我要做的

const now = new Date();
const openedHours = card.openHours.find(i => i.days.includes(now.getDay()));
const nextDay = new Date(Date.now() + 3600 * 1000 * 24);
var nextAvailableDayOfTheWeek = nextDay.getDay();
var availableDays = new Array();
for ( let index = 0; index < openHours.length; index++ ) { // gathers all available days
    availableDays = availableDays.concat(openHours[index].days);
}
while ( ! availableDays.includes(nextAvailableDayOfTheWeek) ) { // if nextAvailableDayOfTheWeek is not available, go look for the next day that is
    nextAvailableDayOfTheWeek++;
    if ( 7 == nextAvailableDayOfTheWeek ) nextAvailableDayOfTheWeek = 0; // if after saturday then reset to sunday
}

不幸的是,它不起作用,因为我需要在商店OpenSanPower编辑时渲染特定的下一个开放日。请立即尝试,但这也只适用于星期天是关闭日,如果星期六或其他任何一天是关闭日怎么办仅适用于星期天是唯一关闭日,如果星期六也是关闭日怎么办,或者任何其他日期代码–仅适用于NSWER并不是特别有用。一个好的答案应该解释OP为什么会有问题,以及你的代码是如何解决的。如果周日不是唯一可能的休息日,那么你应该在你的问题中说明这一点。你的声明是数据就是数据,不能更改。请尽量提前了解你的需求和行为。它是我们很乐意提供一些示例数据和预期结果。在这个主题上已经有了一个解决方案。您应该重新考虑您的数据结构,以便它更灵活、更易于使用。