Gitee
Appearance
InputGroup 智能输入框
增强型文本输入框，可自定义右侧按钮及文本齐方式
基本用法
占位符
状态
扩展区域
样式
事件
属性
| 属性名 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| autocomplete | off，on | off | 针对 txt 类型的输入框，是否启用自动完成.off 不启用自动完成，on 启用自动完成,具体可以参考原生input autocomplete属性赋值 |
| customClass | string | -- | 自定义样式 |
| disable | boolean | false | 禁用输入功能，true 是禁用。 |
| readonly | boolean | false | 只读 |
| editable | boolean | true | 是否允许编辑，true 是允许编辑 |
| enableClear | boolean | true | 是否启用清空按钮，true 是当有文本时显示清空按钮 |
| enableTitle | boolean | true | 鼠标移动到组件内时显示组件内的文本，true 是启用提示 |
| enableViewPassword | boolean | true | 是否启用查看密码明文功能，true 是启用 |
| forcePlaceholder | boolean | false | 是否始终显示占位符文本。true 始终显示占位符 |
| groupText | string | -- | 扩展按钮的文本 |
| groupTextTemplate | templateRef | -- | 扩展按钮的模板 |
| isPassword | boolean | false | 是否启用密码模式 |
| maxLength | number | -- | 设置文本最大长度 |
| modelValue | string | -- | 组件绑定值 |
| placeholder | string | -- | 启用提示信息文本 |
| showButtonWhenDisabled | boolean | false | 当组件禁用或只读时显示后边的按钮 |
| tabIndex | number | 0 | tab键索引,默认从0开始，-1表示不可通过Tab键获得焦点 |
| textAlign | string | left | 文本在输入框中的对齐方式，可选: left 左对齐、center 居中对齐、right 右对齐 |
| useExtendInfo | boolean | false | 是否启用前置扩展信息；设置为true后，鼠标悬停时显示 extendInfo配置的文本 |
| extendInfo | string | -- | 前置扩展信息文本 |
| value | string | -- | 输入值 |
| showBorder | boolean | true | 是否显示边线，默认 true显示边线 |
| type | string | text | 输入框类型，可选：text 文本输入框、number 数字输入框、password 密码输入框、textarea 多行文本输入框 |
事件
| 事件名 | 参数 | 说明 |
|---|---|---|
| clear | -- | 点击清空按钮事件 |
| change | 新值 | 值变化事件，当元素的值发生任何变化时立即触发 |
| blur | MouseEvent | 失去焦点事件，参数类型详见 MouseEvent |
| click | MouseEvent | 输入框点击事件，参数类型详见 MouseEvent |
| clickHandle | {originalEvent:原事件} | 点击图标触发的事件 |
| focus | MouseEvent | 得到焦点事件，参数类型详见 MouseEvent |
| input | 新值 | 值变化事件，当元素的值变化在失去焦点时触发 |
| keydown | MouseEvent | 键盘按下事件，参数类型详见 MouseEvent |
| keyup | MouseEvent | 键盘弹起事件，参数类型详见 MouseEvent |
| iconMouseEnter | MouseEvent | 进入图标区域事件，参数类型详见 MouseEvent |
| iconMouseLeave | MouseEvent | 离开图标区域事件，参数类型详见 MouseEvent |
| update:modelValue | -- | modelValue 值更新事件 |
| updateExtendInfo | -- | 展示前置扩展信息事件 |
插槽
| 插槽名 | 说明 |
|---|---|
| groupTextTemplate | 扩展区域自定义模板 |