reactjs 如何在react js中使用React日期选择器禁用过去时间

n3schb8v 于 2022-11-22 发布在 React

关注(0)|答案(3)|浏览(136)

请指导我如何禁用过去的时间在ReactJS。下面我分享的代码？

import DatePicker from "react-datepicker";
import setHours from "date-fns/setHours";
import setMinutes from "date-fns/setMinutes";
import "react-datepicker/dist/react-datepicker.css";

<DatePicker selected={startDates} onChange={(date) => setStartDates(date)} showTimeSelect
excludeTimes={[
setHours(setMinutes(new Date(), 0), new Date().getHours())]} dateFormat="MMMM d, yyyy h:mm aa" />

reactjs

来源：https://stackoverflow.com/questions/73891977/how-to-disable-past-time-in-react-js-using-react-date-picker

3条答案

按热度按时间

afdcj2ne1#

是的，根据上面的注解，您可以使用minDate

<DatePicker
  selected={startDate}
  onChange={(date) => setStartDate(date)}
  {... otherProps}
  minDate={new Date()} // This here is what we require
/>

赞(0）回复(0）举报 2022-11-22

fslejnso2#

我想这就是你想要的

<DatePicker
  selected={startDates}
  onChange={(date) => setStartDates(date)}
  showTimeSelect
  minDate={new Date()} //set the current date to disable past date
  minTime={new Date().getTime()} //set current time to disable past time
  maxTime={setHours(setMinutes(new Date(), 59), 23)} //this set the max time (i.e. 23:59)
  dateFormat="MMMM d, yyyy h:mm aa"
/>

赞(0）回复(0）举报 2022-11-22

gywdnpxw3#

() => {
  const [startDate, setStartDate] = useState(
    setHours(setMinutes(new Date(), 30), 17)
  );
  return (
    <DatePicker
      selected={startDate}
      onChange={(date) => setStartDate(date)}
      showTimeSelect
      minTime={setHours(setMinutes(new Date(), 0), 17)}
      maxTime={setHours(setMinutes(new Date(), 30), 20)}
      dateFormat="MMMM d, yyyy h:mm aa"
    />
  );
};

赞(0）回复(0）举报 2022-11-22

我来回答

reactjs 如何在react js中使用React日期选择器禁用过去时间

3条答案

相关问题

热门标签

最新问答