Calendar 日历
选择一天或一个区间。周一开头,值是 YYYY-MM-DD 字符串。
2026 年 11 月
一二三四五六日
选中:2026-11-13
2026 年 11 月
一二三四五六日
区间:2026-11-03 ~ 2026-11-09
值和 <input type="date">、后端传的日期一样是 YYYY-MM-DD 字符串,toDateString / parseDateString 在 Date 和字符串之间转换。要放在输入框里弹出,用 DatePicker。
安装
pnpm dlx shadcn@latest add https://docs.linasan.cn/r/calendar.json第一次装本站的组件前先在项目里执行一次 shadcn init,详见 安装。
用法
import { Calendar } from '@/components/ui/calendar';
const [day, setDay] = useState('2026-11-13');
<Calendar value={day} onChange={setDay} />
<Calendar mode="range" value={range} onChange={setRange} months={2} />属性
属性
类型