Input 输入框

通过鼠标或键盘输入字符。

基础用法

输入值: (空)

<my-input v-model="value" placeholder="请输入内容" />

不同类型

<my-input type="text" placeholder="文本" />
<my-input type="password" placeholder="密码" show-password />
<my-input type="email" placeholder="邮箱" />

可清空

<my-input v-model="value" clearable />

组件结构

根元素 <div class="my-input"> 按顺序包含：前置插槽 __prepend、内部包裹容器 __inner-wrap（内有前缀 __prefix、<input> 或 <textarea> 元素 __inner、后缀 __suffix）、后置插槽 __append。

CSS 类名

类名	说明
.my-input	根元素
.my-input--textarea	文本域模式
.my-input--prepend	有前置内容
.is-large	大尺寸
.is-small	小尺寸
.is-disabled	禁用状态
.is-readonly	只读状态
.my-input__inner-wrap	输入框内部包裹容器
.my-input__inner	原生 input/textarea 元素
.my-input__prepend	前置内容区
.my-input__append	后置内容区
.my-input__prefix	输入框内前缀
.my-input__suffix	输入框内后缀
.my-input__clear	清空按钮
.my-input__password-toggle	密码可见切换按钮

API

属性	说明	类型	默认值
modelValue	绑定值	string | number	—
type	输入框类型	'text' | 'password' | 'textarea' | 'email' | 'tel' | 'url'	'text'
placeholder	占位文字	string	—
disabled	是否禁用	boolean	false
clearable	是否可清空	boolean	false
showPassword	是否显示密码	boolean	false

插槽	说明
prepend	前置内容
append	后置内容
prefix	前缀
suffix	后缀