Skip to main content

时间选择器

时间选择器

适用场景

需要选择日期或时间时,适用于制定计划、请假、加班申请等业务中对时间录入的诉求。

属性介绍

属性分类属性名称属性作用
基本属性组件ID组件在当前页面的唯一标识。
组件标题设置组件的标题显示。可选择常量输入和无标题显示。
提示文案输入框内部指引用户操作的提示性文本。
展示模式包含编辑模式、只读模式、文本模式和继承父组件模式。用以组件在不同业务模式下的展示区分。
时间类型设置展示的时间类型。img
展示格式当用户选择了时间类型时,同步展示对应格式。
数据属性选择字段当放置在表单组件内部时,需选择要绑定的表单组件上下文对象中的属性。
默认值输入框显示的默认内容。支持常量输入、表达式输入和无。
校验规则必填勾选时生效,设置该输入框为必填。可设置校验提示信息。img
自定义函数勾选时生效,可自定义校验函数。可设置校验提示信息。img
交互属性值变化用以设置输入内容变化时所要执行的动作。

基础功能

时间选择器是一个输入组件,多用于表单组件内部,可以关联表单对象中的时间类型属性字段,用以日期时间选择。基本用法如下:

步骤1: 参照表单组件基本用法,新建表单页面,并且为表单组件选择数据源,绑定上下文(比如绑定已建对象“客户信息”):

img

步骤 2: 从左侧的组件列表拖动“时间选择器”组件到画布区域表单组件内,然后在右侧组件的属性面板设置组件标题、提示文案、展示模式、时间类型等基础属性信息:

img

步骤 3: 为时间选择器组件关联表单对象字段(例如创建日期),如下所示:

img

img

步骤 4: 设置校验规则,例如勾选必填,设置提示信息为“日期选择不能为空”:

img

步骤 5: 配置完以上属性,可设置当日期选择器配置值变化事件,当其内容发生变化时想要执行的动作,例如打开关闭页面、触发已建流程等。

img

最终运行态组件展示如下:

img

img

高级功能

暂无