# li-text-field

<!-- Auto Generated Below -->

## Properties

| Property                 | Attribute                 | Description                                                                                             | Type                                                                                                                                                  | Default           |
| ------------------------ | ------------------------- | ------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------- |
| `counter`                | `counter`                 | 输入计数 {boolean}                                                                                      | `boolean \| undefined`                                                                                                                                | `undefined`       |
| `disabled`               | `disabled`                | 是否禁用 {boolean}                                                                                      | `boolean \| undefined`                                                                                                                                | `false`           |
| `experimentalControlled` | `experimental-controlled` | 使Input类型的行为表现为像React中的受控组件(在React中，受控组件是由组件状态处理表单数据的组件) {boolean} | `boolean \| undefined`                                                                                                                                | `false`           |
| `helperText`             | `helper-text`             | 输入提示文本 {string}                                                                                   | `string \| undefined`                                                                                                                                 | `''`              |
| `inputAutoFocus`         | `input-auto-focus`        | 页面加载后，输入框自动获取焦点 {boolean}                                                                | `boolean \| undefined`                                                                                                                                | `undefined`       |
| `inputId`                | `input-id`                | 输入框ID {string}                                                                                       | `string \| undefined`                                                                                                                                 | `undefined`       |
| `inputModeType`          | `input-mode-type`         | 输入模式类型                                                                                            | `"decimal" \| "email" \| "none" \| "numeric" \| "search" \| "tel" \| "text" \| "url" \| undefined`                                                    | `'text'`          |
| `invalid`                | `invalid`                 | 是否有效 {boolean}                                                                                      | `boolean \| undefined`                                                                                                                                | `false`           |
| `label`                  | `label`                   | 标签 {string}                                                                                           | `string \| undefined`                                                                                                                                 | `''`              |
| `list`                   | `list`                    | 输入列表 {string}                                                                                       | `string \| undefined`                                                                                                                                 | `undefined`       |
| `max`                    | `max`                     | 定义数字类型输入值的最大值。比如：月份，日期，时间等 {number}                                           | `number \| undefined`                                                                                                                                 | `undefined`       |
| `maxLength`              | `max-length`              | 输入字符串的最大长度 {number}                                                                           | `number \| undefined`                                                                                                                                 | `undefined`       |
| `min`                    | `min`                     | 定义数字类型输入值的最小值。比如：月份，日期，时间等 {number}                                           | `number \| undefined`                                                                                                                                 | `undefined`       |
| `minLength`              | `min-length`              | 输入字符串的最小长度 {number}                                                                           | `number \| undefined`                                                                                                                                 | `undefined`       |
| `name`                   | `name`                    | 名称 {string}                                                                                           | `string \| undefined`                                                                                                                                 | `''`              |
| `placeholder`            | `placeholder`             | 占位符 {string}                                                                                         | `string \| undefined`                                                                                                                                 | `''`              |
| `readonly`               | `readonly`                | 是否只读 {boolean}                                                                                      | `boolean \| undefined`                                                                                                                                | `false`           |
| `required`               | `required`                | 是否必填项 {boolean}                                                                                    | `boolean \| undefined`                                                                                                                                | `undefined`       |
| `size`                   | `size`                    | 组件大小 {string}                                                                                       | `string \| undefined`                                                                                                                                 | `''`              |
| `step`                   | `step`                    | step属性指定<input type=“number”>元素中合法数字之间的间隔 {string}                                      | `string \| undefined`                                                                                                                                 | `'1'`             |
| `styles`                 | `styles`                  | 可选属性，注入的样式style字符串 {string}                                                                | `string \| undefined`                                                                                                                                 | `undefined`       |
| `transparent`            | `transparent`             | 背景是否透明 {boolean}                                                                                  | `boolean \| undefined`                                                                                                                                | `undefined`       |
| `type`                   | `type`                    | 类型                                                                                                    | `"date" \| "datetime-local" \| "email" \| "hidden" \| "month" \| "number" \| "password" \| "tel" \| "text" \| "time" \| "url" \| "week" \| undefined` | `'text'`          |
| `value`                  | `value`                   | 输入值                                                                                                  | `number \| string \| string[] \| undefined`                                                                                                           | `''`              |
| `variant`                | `variant`                 | 变体                                                                                                    | `"danger" \| "informational" \| "success" \| "warning" \| undefined`                                                                                  | `'informational'` |

## Events

| Event        | Description                                                     | Type                                  |
| ------------ | --------------------------------------------------------------- | ------------------------------------- |
| `li-blur`    | 当输入框失去焦点时触发 {EventEmitter<void>}                     | `CustomEvent<void>`                   |
| `li-change`  | 当输入框值发生变化时触发 {EventEmitter<InputChangeEventDetail>} | `CustomEvent<InputChangeEventDetail>` |
| `li-focus`   | 当输入框获得焦点时触发 {EventEmitter<void>}                     | `CustomEvent<void>`                   |
| `li-input`   | 当键盘输入时触发 {EventEmitter<KeyboardEvent>}                  | `CustomEvent<KeyboardEvent>`          |
| `li-keydown` | 当键盘键按下时触发 {EventEmitter<KeyboardEvent>}                | `CustomEvent<KeyboardEvent>`          |

## Dependencies

### Used by

- [li-data-grid](../data-grid)

### Depends on

- [li-helper-text](../helper-text)

### Graph

```mermaid
graph TD;
  li-text-field --> li-helper-text
  li-helper-text --> li-icon-alert-information
  li-helper-text --> li-icon-alert-error
  li-helper-text --> li-icon-alert-success
  li-data-grid --> li-text-field
  style li-text-field fill:#f9f,stroke:#333,stroke-width:4px
```

---

_Built with ITSI_
