| category | type | title | cover | coverDark |
|---|---|---|---|---|
Components |
Data Entry |
InputNumber |
Enter a number within certain range with the mouse or keyboard.
When a numeric value needs to be provided.
| property | description | type | default | |
|---|---|---|---|---|
| addonAfter | The label text displayed after (on the right side of) the input field | slot | - | 3.0 |
| addonBefore | The label text displayed before (on the left side of) the input field | slot | - | 3.0 |
| autofocus | get focus when component mounted | boolean | false | |
| bordered | Whether has border style | boolean | true | 3.0 |
| controls | Whether to show +- controls |
boolean | true | 3.0 |
| decimalSeparator | decimal separator | string | - | |
| defaultValue | initial value | number | ||
| disabled | disable the input | boolean | false | |
| formatter | Specifies the format of the value presented | function(value: number | string, info: { userTyping: boolean, input: string }): string | - | info: 3.0 |
| keyboard | If enable keyboard behavior | boolean | true | 3.0 |
| max | max value | number | Infinity | |
| min | min value | number | -Infinity | |
| parser | Specifies the value extracted from formatter | function( string): number | - | |
| precision | precision of input value | number | - | |
| prefix | The prefix icon for the Input | slot | - | 3.0 |
| size | height of input box | string | - | |
| status | Set validation status | 'error' | 'warning' | - | 3.3.0 |
| step | The number to which the current value is increased or decreased. It can be an integer or decimal. | number|string | 1 | |
| stringMode | Set value as string to support high precision decimals. Will return string value by change |
boolean | false | 3.0 |
| value(v-model) | current value | number | ||
| upIcon | custom up icon | slot | <UpOutlined /> |
3.3.0 |
| downIcon | custom up down | slot | <DownOutlined /> |
3.3.0 |
| Events Name | Description | Arguments | Version | |
|---|---|---|---|---|
| change | The callback triggered when the value is changed. | function(value: number | string) | ||
| pressEnter | The callback function that is triggered when Enter key is pressed. | function(e) | 1.5.0 | |
| step | The callback function that is triggered when click up or down buttons | (value: number, info: { offset: number, type: 'up' | 'down' }) => void | 3.0 |
| Name | Description |
|---|---|
| blur() | remove focus |
| focus() | get focus |
Developer handle data by their own in control. It will make data out of sync if InputNumber change display value. It also cause potential data issues when use in form.
change is user trigger event. Auto trigger will makes form lib can not detect data modify source.