首页 > 解决方案 > 如何将数组内的对象和每个对象相乘,获取一个或多个键并减少它们的值?

问题描述

我有这个数组:

const disabledDays = [
       {
         year: selectedDay.year,
         month: selectedDay.month,
         day: selectedDay.day -1
       }
     ];

我会将它作为组件内部的道具传递:

 <DatePicker
          value={selectedDayTwo}
          onChange={setSelectedDayTwo}
          locale={myCustomLocale} // custom locale object
          shouldHighlightWeekends
          formatInputText={formatInputValueTwo} // format value
          calendarTodayClassName="custom-today-day" // also this
          calendarClassName="custom-calendar" // and this
          colorPrimary="rgba(4, 173, 147, 255)" // added this
          disabledDays={disabledDays} // here we pass them      <-    LOOOOK HERE
          onDisabledDayError={handleDisabledSelect} // handle error
        />

第一个问题:问题是disabledDays当前及其第一个对象正在禁用选定日期的前一天,其日期为: selectedDay.day -1并且为了禁用该选定日期之前的所有日期,我必须创建disabledDays中的另一个对象并执行day: selectedDay.day -2 do day: selectedDay.day -3 .... 等一天。

第二个问题:所以另一个问题是我不能只做: selectedDay.day -1000000 或无限。此外,如果我确实遵循为每一天创建一个对象的方法,那么一切都受所选日期的限制。因此,例如,如果选定的日期是 1 月 1日,那么 selectedDay.day -1将不起作用,因为我还必须记住相应地减去月份和年份。

第三个问题:如果我这样做:(按照 1 月 1 日的示例)月份:selectedDay.month -1 和日期:selectedDay.day -1 它将花费 12 月份,但这一天又不会工作,因为会是 1 12 月 - 1 不工作,因为没有看到 11 月。

不确定是否有意义,但似乎唯一的策略是在对象中手动应用/添加日期。我正在考虑是否有一种动态方法可以通过将数组中的对象和每个对象相乘,获取一个或多个键,并根据所选日期相应地减小它们的值。任何线索将不胜感激。我正在使用这个

标签: javascriptarraysreactjsreact-nativejavascript-objects

解决方案


让我改写你的问题,如果我错了,请纠正我。

使用 REACT-MODERN-CALENDAR-DATEPICKER 组件禁用所选日期之前的所有日期。

根据文档,这可以通过设置minimumDate组件DatePicker来实现。

一个简单的实现如下

import "react-modern-calendar-datepicker/lib/DatePicker.css";
import DatePicker from "react-modern-calendar-datepicker";
import { useEffect, useState } from "react";

export default function App() {
  const [selectedDay, setSelectedDay] = useState(null);
  const [minDay, setMinDay] = useState([]);

  useEffect(() => {
    if (selectedDay) {
      setMinDay(selectedDay);
    }
  }, [selectedDay]);

  return (
    <div className="App">
      <DatePicker
        value={selectedDay}
        onChange={setSelectedDay}
        inputPlaceholder="Select a day"
        shouldHighlightWeekends
        minimumDate={minDay}
      />
    </div>
  );
}

如果您选择 2021 年 9 月 22 日,则 2021 年 9 月 22 日之前的所有日子都将被禁用。

参考:最小和最大日期


推荐阅读