0
268
VistasDiseño de React Ant ¿Por qué ciertas horas y minutos de días después de hoy están deshabilitados?
¿Por qué ciertas horas y minutos de días después de hoy están deshabilitados?
Hola. Estoy usando el selector de fecha Antdesign. Escribí una función. Como fecha futura, solo se puede tomar una fecha 3 minutos después de hoy. La fecha no debe tomarse antes de la hora actual. configuré esto. pero quiero establecer esta regla solo para hoy. ¿Cómo puedo cancelar esta regla para otros días?
function getDisabledHours() { var hours = []; for (let i = 0; i < moment().hour(); i++) { hours.push(i); } return hours; } function getDisabledMinutes() { var minutes = []; for (var i = 0; i - 3 < moment().minute(); i++) { minutes.push(i); } return minutes; } <DatePicker onChange={(d, v) => { setStartTime(d, v); }} placeholder="Select Start Time" format="YYYY-MM-DD HH:mm" disabledDate={disabledDate} disabledHours={getDisabledHours} disabledMinutes={getDisabledMinutes} showSecond={false} // disabledSeconds={getDisabledSeconds} showTime={{ defaultValue: moment(true, "HH:mm") }} suffixIcon={DateIcon} />
·
Juan Pablo Isaza
1 Respuestas
Responde la pregunta0
Creo que será más fácil para ti si separas tus entradas y haces esto:
import React, { useState } from "react" import moment from "moment" import { DatePicker, TimePicker } from "antd" const Example = () => { const [startDate, setStartDate] = useState() const [startTime, setStartTime] = useState() const disabledDate = (current) => { return current && current <= moment().startOf("day") } const range = (start, end) => { const result = [] for (let i = start; i < end; i++) { result.push(i) } return result } const disabledTime = (current) => { const now = moment() if (current.isSame(startDate, "day")) { return { disabledHours: () => range(0, now.get("hours")), disabledMinutes: () => range(0, now.get("minutes") + 3), } } else { return { disabledHours: () => [], disabledMinutes: () => [], } } } return ( <> <DatePicker onChange={(date) => setStartDate(date)} placeholder="Select Start Date" format="YYYY-MM-DD" disabledDate={disabledDate} /> <TimePicker onChange={(time) => setStartTime(time)} format="HH:mm" disabled={startDate === undefined} disabledTime={disabledTime} /> </> ) } export default Example
·
Juan Pablo Isaza
Denunciar
Responde la pregunta