跳到主要内容

时间选择框

用于在表单或页面中让用户选择具体时间。

一、何时使用​

时间选择框适用于用户需要指定具体时间的场景，例如：

  • 设置文章发布时间
  • 医院挂号选择就诊时间
  • 外卖预约送达时间
  • 上门取件预约时间

二、属性配置​

1. 数据配置​

数据配置

1.1 数据绑定​

时间选择框可通过字段绑定数据源，绑定方式详见：数据绑定。

  • 字段绑定依赖 API，动态获取数据：

    字段绑定示意
    API加载示意

1.2 初始值设置​

初始值有两种设置方式：

  • 手动赋值：可选择特定时间或“此刻时间”，如下图：

    手动赋值选择
    时间下拉框
    手动赋值设置效果

  • 视图参数：通过传参设置时间初始值：

    视图参数效果

2. 功能配置​

功能配置面板

2.1 占位提示​

为空时在输入框内显示提示文字，引导用户操作：

占位提示示意

2.2 标题设置​

为时间选择框添加说明性标题：

标题设置

2.3 按钮文本设置​

  • 取消按钮：可自定义取消按钮的显示文本
    取消按钮设置

  • 确认按钮：可自定义确认按钮的显示文本
    确认按钮设置

3. 状态配置​

暂无特殊状态项，详见：通用状态。

三、规则配置​

3.1 表单校验​

支持与其他组件一致的表单校验机制。

3.2 显示控制​

可根据视图参数或逻辑条件控制组件显示与隐藏。

四、样式配置​

暂无组件特有样式，详见：通用样式。

五、常见使用场景​

  1. 设置文章或内容的发布时间：
    发布时间示例

  2. 医院挂号选择就诊时间：
    挂号示例

  3. 预约外卖送达时间：
    外卖时间选择