> ## Documentation Index
> Fetch the complete documentation index at: https://help.dingtalk.io/llms.txt
> Use this file to discover all available pages before exploring further.

# NumberField

> Reference for the NumberField component. Configure precision, step size, upper and lower limits, and automatically validate and correct numeric input.

## When to Use

* A numeric selector that validates and automatically corrects input values.

## Component Example

## Component Properties

| Attribute             | Description                                                                                                                          | Type                                                             | Default            |
| --------------------- | ------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------- | ------------------ |
| `behavior`            | Form component display status                                                                                                        | [Behavior](/open/yida/components/interface#behavior)             | `'NORMAL'`         |
| `innerAfter`          | Unit text for the number input field                                                                                                 | `string`                                                         | -                  |
| `innerBefore`         | Prefix text for the form component                                                                                                   | `string`                                                         | -                  |
| `label`               | Title of the form component                                                                                                          | `string`                                                         | -                  |
| `labelAlign`          | Location of the form component title                                                                                                 | `'left' \| 'top'`                                                | `'top'`            |
| `labelColOffset`      | Offset position of the title. The value uses a grid unit, where 1 represents 1/24                                                    | `number`                                                         | `0`                |
| `labelColSpan`        | Width of the title. The value uses a grid unit, where 1 represents 1/24                                                              | `number`                                                         | `4`                |
| `labelTextAlign`      | Alignment of the form component title                                                                                                | `'left' \| 'right'`                                              | `'right'`          |
| `labelTipsIcon`       | Entry icon for the form component title tips. Takes effect when labelTipsTypes is set to **text** or **render**                      | `string`                                                         | -                  |
| `labelTipsRender`     | Custom rendering method for the form component title tips. Takes effect when labelTipsTypes is set to **render**                     | `(props: IComponentProps) => ReactNode`                          | -                  |
| `labelTipsText`       | Text of the form component title tips. Takes effect when labelTipsTypes is set to **text**                                           | `string`                                                         | -                  |
| `labelTipsTypes`      | Type settings for the form component title tips                                                                                      | [LabelTipsTypes](/open/yida/components/interface#labeltipstypes) | `'none'`           |
| `onChange`            | Value change event of the form component                                                                                             | `({value: number}) => void`                                      | -                  |
| `placeholder`         | Placeholder text for the form component                                                                                              | `string`                                                         | `'Enter a number'` |
| `precision`           | Number of decimal places. Allowed values: 0 - 20                                                                                     | `number`                                                         | `0`                |
| `size`                | Size of the form component                                                                                                           | [Size](/open/yida/components/interface#size)                     | `'medium'`         |
| `thousandsSeparators` | Whether to use a thousands separator                                                                                                 | `boolean`                                                        | `false`            |
| `tips`                | Description of the form component, displayed below the control                                                                       | `string`                                                         | -                  |
| `validation`          | Validation settings of the form component. For details, see the [form validation documentation](/open/yida/guide/concept/validation) | [Validation\[\]](/open/yida/components/interface#validation)     | `[]`               |
| `value`               | Default value of the form component                                                                                                  | `number`                                                         | -                  |
| `wrapperColOffset`    | Offset position of the form component. The value uses a grid unit, where 1 represents 1/24                                           | `number`                                                         | `0`                |
| `wrapperColSpan`      | Width of the form component. The value uses a grid unit, where 1 represents 1/24                                                     | `number`                                                         | `0`                |