# InputNumber 数字输入框
# InputNumber 概述
使用鼠标或键盘输入一定范围的标准数值。
# InputNumber 代码演示
# 基础用法
可以通过输入、鼠标点击或键盘的上下键来改变数值大小。
# 小数
通过设置 step
属性控制每次改变的精度。
# 尺寸
通过设置 size
属性为 large
和 small
将输入框设置为大和小尺寸,不设置为默认(中)尺寸。
# 不可用
通过设置 disabled
属性禁用输入框,点击按钮切换状态。
通过设置 readonly
设置只读状态,点击按钮切换状态。
# 事件使用以及后置分发
数值改变时的回调,返回当前值。
# 删除或者清空后置为 0 或者最小值
删除或者清空后置为 0,若有最小值则置为最小值。
# InputNumber API
# InputNumber props
属性 | 说明 | 类型 | 默认值 |
---|---|---|---|
max | 最大值 | Number | Number.MAX_SAFE_INTEGER(9007199254740991) |
min | 最小值 | Number | Number.MIN_SAFE_INTEGER(-9007199254740991) |
value | 当前值,可以使用 v-model 双向绑定数据 | Number | 1 |
step | 每次改变的步伐,可以是小数 | Number | 1 |
size | 输入框尺寸,可选值为 large 和 small 或者不填 | String | - |
disabled | 设置禁用状态 | Boolean | false |
readonly | 设置只读状态 | Boolean | false |
precision | 数值精度,有效值为 0-20。如果需要实现立即更新 DOM,则需要绑定一个唯一 key 值来管理可复用的元素,实现元素间的独立性。 | Number | - |
setzero | 删除或者清空后置为 0 或者最小值 | Boolean | false |
notScientificNotation | 禁止以科学计数法显示数字 (v1.0.33) | Boolean | false |
tabindex | 设置输入框 tabindex (v1.0.4) | String | Number | -1 |
focusAllSelect | 聚焦时全选中控件内容 (v1.0.48) | Boolean | false |
initNotShowNumber | 初始化时,当 value 值是 null 时,输入框不显示 0 或者最小值 (v1.0.73) | Boolean | false |
# InputNumber events
事件名 | 说明 | 返回值 |
---|---|---|
on-change | 数值改变时的回调,返回当前值 | 当前值 |
on-focus | 输入框获取焦点时触发,返回当前事件 | 当前事件 |
on-blur | 输入框失去焦点时触发,返回当前事件 | 当前事件 |
# InputNumber slot
名称 | 说明 |
---|---|
append | 后置内容,设置后置内容时请设置默认宽度 (v1.0.28) |