InputNumber 数字输入框
InputNumber 组件用于处理数字类型的输入,支持精度控制和范围限制。
参数
Props
| 名称 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| modelValue | number | null | - | 绑定值 |
| min | number | -Infinity | 最小值 |
| max | number | Infinity | 最大值 |
| precision | number | - | 数值精度,小数位数 |
| placeholder | string | - | 占位文本 |
| disabled | boolean | false | 是否禁用 |
| readonly | boolean | false | 是否只读 |
| clearable | boolean | false | 是否可清空 |
| size | ComponentSize | 'medium' | 尺寸 |
| status | 'success' | 'warning' | 'error' | - | 状态样式 |
Events
| 名称 | 描述 | 参数 |
|---|---|---|
| update:modelValue | 值变化时触发 | (value: number | null) => void |
| change | 值变化时触发 | (value: number | null, event: Event) => void |
| focus | 获取焦点时触发 | (event: FocusEvent) => void |
| blur | 失去焦点时触发 | (event: FocusEvent) => void |
| clear | 点击清除按钮时触发 | () => void |
示例
基础用法
最大值和最小值
精度控制
尺寸
状态
可清空
TypeScript
ts
// 组件尺寸
export type ComponentSize = "small" | "medium" | "large";
// 组件状态
export type ComponentStatus = "success" | "warning" | "error";