|
目前只有disableDate和timePickerProps,联合起来写 难度比较大,有什么简洁一点的方案吗? |
Answered by
RylanBot
Jun 16, 2026
Replies: 2 comments
|
尝试实现了这个需求,感觉代码量还好 (?) import React from 'react';
import dayjs from 'dayjs';
import { DatePicker } from 'tdesign-react';
export default function DatePickerDemo() {
const disableTime = (date: Date) => {
const now = dayjs();
const selected = dayjs(date);
// 只有选中的是今天,才需要禁用时间
if (!selected.isSame(now, 'day')) return {};
const currentHour = now.hour();
const currentMinute = now.minute();
const currentSecond = now.second();
const selectedHour = selected.hour();
const selectedMinute = selected.minute();
return {
// 禁用当前小时之前的所有小时
hour: Array.from({ length: currentHour }, (_, i) => i),
// 当面板当前滚动到的小时 === 当前小时时,禁用当前分钟之前的所有分钟
minute: selectedHour === currentHour ? Array.from({ length: currentMinute }, (_, i) => i) : [],
// 当面板当前滚动到的小时和分钟都 === 当前时,禁用当前秒之前的所有秒
second:
selectedHour === currentHour && selectedMinute === currentMinute
? Array.from({ length: currentSecond }, (_, i) => i)
: [],
};
};
return (
<DatePicker
enableTimePicker
defaultTime={dayjs().format('HH:mm:ss')}
disableDate={{ before: dayjs().format('YYYY-MM-DD') }}
disableTime={disableTime}
/>
);
} |
0 replies
Answer selected by
kajweb
|
为什么不搞为 可选时间范围[] 或者 不可选时间范围[]; |
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
尝试实现了这个需求,感觉代码量还好 (?)