跳到主要内容

DatePicker 日期选择框器

用于选择某一具体日期或某一段日期区间。


日期选择器

用于具体日期的选择。用户仅需要输入非常具体的日期信息时使用。

月份选择器

用于月份的选择。用户仅需输入月份信息时使用。

年份选择器

用于年份的选择。用户仅需输入年份信息时使用,常用于如年账单等按年记录数据的查询场景。

日期区间选择器

用于某一段日期的选择。用户需要输入一段日期区间时使用。

日期时间区间选择器

用于日期和时间相关联的选择。用户需要输入包含时间在内的日期时使用。

不同尺寸

设置了三种尺寸默认高度:40px、32px、24px。

不同状态

日期选择器的不同交互状态。

设计指南

1.与页面布局相关 :日期选择器可放置于页面顶部或内容模块上方,与下方数据结果产生联动。 2.组件搭配使用:与表格搭配使用,按日期或日期区间对表格数据进行筛选。

何时使用

  • 当需要输入日期时
  • 当需要输入一个日期区间时
  • 常用于表单中日期输入,或数据筛选条件中进行日期条件输入