Skip to main content

数字输入框

数字输入框

适用场景

数字输入框可用于录入数字类型的相关信息,比如金额、年龄、数量等,录入的数字可用来计算、汇总等等。

属性介绍

属性分类属性名称属性作用
基本属性组件ID组件在当前页面的唯一标识。
组件标题用来定义展示在页面上时,输入框前的标题文字(支持常量、表达式和无标题三种方式)
提示文案在未输入时,输入框中展示的文字
展示方式支持编辑模式、只读模式(不可操作)、文本模式和继承父组件模式四种模式,用以页面在不同业务模式下的展示区分。
尺寸用来快速(在样式面板可详细定义)定义组件大小,有m(输入框60px)、l(输入框90px)两种模式。
精度用于控制小数位个数
显示条件支持表达式输入和无条件两种方式来确定当前组件是否展示
两侧按钮用于步增/减输入框中数值img
数据属性选择字段点击输入框选择数值类型的字段(字段限制可能为整数,但组件配置了精度,以组件为准,这点需要用户注意,选择正确的数值类型)。
默认值用以默认填充数值输入框的值。有三种选择:常量(比如18)、表达式输入、无(通常都是”无“)。
校验规则必填同以上组件中的必填校验
自定义函数同以上组件中的自定义函数校验
最小值用以限制数值输入框中的最小值,并且可输入错误提示,不满足时提示img
最大值用以限制数值输入框中的最大值,并且可输入错误提示,不满足时提示img
交互属性值变化值变化时,要触发的动作。
获得焦点输入框获得焦点时,要触发的动作。
失去焦点输入框失去焦点时,要触发的动作。

基础功能

当你需要一个只能输入数字的输入框时,比如金额、重量、年龄这类的数值型输入时,name你可能会需要数字输入框。它的基本用法如下:

步骤1:“对象建模”页面,在对象中增加字段(可选整数、实数)。

img

步骤2: 新建页面, 并导入“测试对象”:

新建页面,并拖入表单组件,表单关联步骤1创建的对象“测试对象”,并选择自动填充页面。拖入数字组件,数据源选择关联“测试对象”中的“年龄字段”,并设置标题、精度、尺寸等属性信息。

img

步骤3: 预览页面。

img

至此,我们就得到了只能输入数字的输入框(输入非数字,会被格式化为0)。

高级功能

暂无