根据一天显示不同的时间

我试图根据日期排除不同的时间,但无论我选择什么日期,时间都被禁用。例如,如果我选择 9 月 28 日,则应禁用 12 点钟。如果我选择 10 月 3 日,那么下午 1 点应该被禁用,但是 12 和 1 从一开始就被禁用,并且无论我选择什么日期都保持这种状态。


https://hacker0x01.github.io/react-datepicker


  const isSunday = (date) => {

    const day = getDay(date);

    return day !== 0;

  };


  let excluded = [

    {

      time: "12",

      date: "28/09/2020",

    },

    {

      time: "13",

      date: "03/10/2020",

    },

  ];



    <DatePickerField

      filterDate={isSunday}

      minTime={new Date(new Date().setHours(8, 0, 0))}

      maxTime={new Date(new Date().setHours(17, 0, 0))}

      excludeTimes={excluded.map((exclude, index) => {

        return setHours(

          setMinutes(new Date(), 0),

          parseInt(exclude.time)

        );

      })}

      timeIntervals={60}

      maxDate={addDays(new Date(), 3)}

      dateFormat="d/M/Y HH:mm"

      timeFormat="HH:mm"

      name="time-to-contact"

      label="Required Date *"

    />


慕哥6287543
浏览 120回答 1
1回答

沧海一幻觉

问题是你总是返回excluded道具excludeTimes。只有选择的日期是日期才需要返回时间。类似的东西应该工作。(const [value, setValue] = useState();也通过添加)。<DatePickerField&nbsp; filterDate={isSunday}&nbsp; minTime={new Date(new Date().setHours(8, 0, 0))}&nbsp; maxTime={new Date(new Date().setHours(17, 0, 0))}&nbsp; excludeTimes={excluded.map((exclude) => {&nbsp; &nbsp; const excDate = new Date(exclude.date);&nbsp; &nbsp; if (&nbsp; &nbsp; &nbsp; value &&&nbsp; &nbsp; &nbsp; excDate.getDate() === value.getDate() &&&nbsp; &nbsp; &nbsp; excDate.getFullYear() === value.getFullYear() &&&nbsp; &nbsp; &nbsp; excDate.getMonth() === value.getMonth()&nbsp; &nbsp; ) {&nbsp; &nbsp; &nbsp; return new Date(new Date().setHours(exclude.time, 0, 0));&nbsp; &nbsp; }&nbsp; &nbsp; return null;&nbsp; })}&nbsp; timeIntervals={60}&nbsp; maxDate={addDays(new Date(), 3)}&nbsp; dateFormat="d/M/Y HH:mm"&nbsp; timeFormat="HH:mm"&nbsp; name="time-to-contact"&nbsp; label="Required Date *"&nbsp; onChange={(e) => {&nbsp; &nbsp; setValue(new Date(e));&nbsp; }}&nbsp; selected={value}&nbsp; &nbsp; />此外,您的日期格式不适合 JS,应该是:&nbsp; const excluded = [&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; time: "12",&nbsp; &nbsp; &nbsp; date: "09/28/2020"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; time: "13",&nbsp; &nbsp; &nbsp; date: "10/03/2020"&nbsp; &nbsp; }&nbsp; ];这是一个工作示例的链接: https: //codesandbox.io/s/competent-smoke-4nv1e ?file=/src/App.js要为特定日期(比如星期一)添加排除时间,您可以使用以下命令:const excluded = [&nbsp; {&nbsp; &nbsp; time: "12",&nbsp; &nbsp; day: 1&nbsp; },&nbsp;]并将道具设置为:excludeTimes={excluded.map((exclude) => {&nbsp; if (value && value.getDay() === exclude.day) {&nbsp; &nbsp; return new Date(new Date().setHours(exclude.time, 0, 0));&nbsp; }&nbsp; return null;})}
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript