Tui

InputNumber 数字输入框
用于输入数值,支持步进、范围限制、小数精度以及增减按钮位置控制。
基础输入
最基础的数字输入能力,支持 v-model 双向绑定。
示例代码
vue
范围与步进(min / max / step)
限制输入区间,并通过 step 控制增减的步进值。
示例代码
vue
小数精度(precision)
结合 step 与 precision,控制小数位和数值格式。
示例代码
vue
增减按钮(controls / controlsPosition)
演示是否展示增减按钮,以及 controlsPosition 的配置。
示例代码
vue
属性 Props
属性名
说明
类型
可选值
默认值
版本说明
modelValue
绑定值,数字类型
number
0
min
最小值
number
-Infinity
max
最大值
number
Infinity
step
步进值
number
1
precision
精度(小数位)
number
跟随 step
disabled
是否禁用
boolean
false
placeholder
占位符
string
controls
是否展示增减按钮
boolean
true
controlsPosition
增减按钮位置
'right' | ''
right / ''
''
事件 Events
事件名
说明
回调参数
版本说明
input
输入时触发
(val: number) => void
change
值变化时触发
(val: number) => void
blur
失焦时触发
(val: number) => void
enter
回车时触发
(val: number) => void
clear
点击清空时触发
() => void
插槽 Slots
插槽名
说明
版本说明
prefix-icon
输入框前置图标插槽
suffix-icon
输入框后置图标插槽
suffix
输入框后置插槽
content-bottom
输入框底部插槽
基础输入
范围与步进(min / max / step)
小数精度(precision)
增减按钮(controls / controlsPosition)
属性 Props
事件 Events
插槽 Slots