跳到主要内容

日期范围

日期范围选择组件,用于用户选择一个起始日期和一个结束日期的时间段。


一、何时使用

适用于需要用户输入时间范围的场景:

  • 设置工作经历时段
  • 设置请假日期范围
  • 设置排班时间范围
  • 设置酒店入住和退房时间
  • 设置借还日期

二、属性配置

1. 数据配置

数据配置

1.1 开始日期绑定

可绑定父组件中的数据字段,详见:数据绑定

1.2 开始日期默认值

支持两种设置方式:

  • 手动赋值:直接选择具体日期
  • 视图参数:从上层视图传入动态值

示例:
开始默认值 - 手动赋值
选择日期

1.3 结束日期绑定

同样可绑定父组件中的数据字段,详见:数据绑定

1.4 结束日期默认值

支持手动赋值和视图参数:

结束默认值


2. 功能设置

功能配置

2.1 占位提示

用于引导用户输入或选择日期范围:

占位提示

2.2 标题

作为输入框的辅助信息展示,用于解释输入内容含义:

标题示例

2.3 取消按钮文本

可自定义取消按钮的显示文字,例如“返回”:

取消按钮

2.4 下一步按钮文本

适用于分步骤日期选择流程:

下一步按钮

2.5 确认按钮文本

用于确认选择的日期范围:

确认按钮

2.6 开始时间与结束时间标题

可自定义输入框内标题内容,例如“起始时间”“结束时间”:

时间标题


3. 状态支持

暂无组件专属状态,详见:通用状态


三、样式说明

暂无组件专属样式设置,详见:通用样式


四、典型使用场景

1. 请假时间段选择

请假时间段

2. 酒店入住时间选择

酒店入住时间段