基础用法
带图标的输入框(属性方式)
placeholder="请选择日期"
suffix-icon="el-icon-date"
v-model="input2">
placeholder="请输入内容"
prefix-icon="el-icon-search"
v-model="input21">
带图标的输入框(slot方式)
placeholder="请选择日期"
v-model="input22">
placeholder="请输入内容"
v-model="input23">
复合输入框
 
 
Http://
 
 
.com
 
 
带提示的输入框
class="inline-input"
v-model="state1"
:fetch-suggestions="querySearch"
placeholder="请输入内容"
@select="handleSelect"
>
popper-class="my-autocomplete"
v-model="state2"
:fetch-suggestions="querySearch"
placeholder="请输入内容"
@select="handleSelect">
class="el-icon-edit el-input__icon"
slot="suffix"
@click="handleIconClick">
 
 

   {{ props.item.value }} 
 
 
 
{{ props.item.address }}
input 属性:
参数
类型
说明
可选值
默认值
type
类型
string
text / textarea
text
value
绑定值
string / number
—
—
maxlength
最大输入长度
number
—
—
minlength
最小输入长度
number
—
—
placeholder
输入框占位文本
string
—
—
clearable
是否可清空
boolean
—
false
disabled
禁用
boolean
—
false
size
输入框尺寸,只在 type!=”textarea” 时有效
string
medium / small / mini
—
prefix-icon
输入框头部图标
string
—
—
suffix-icon
输入框尾部图标
string
—
—
rows
输入框行数,只对 type=”textarea” 有效
number
—
2
autosize
自适应内容高度,只对 type=”textarea” 有效,可传入对象,如,{ minRows: 2, maxRows: 6 }
boolean / object
—
false
auto-complete
原生属性,自动补全
string
on, off
off
name
原生属性
string
—
—
readonly
原生属性,是否只读
boolean
—
false
max
原生属性,设置最大值
—
—
—
min
原生属性,设置最小值
—
—
—
step
原生属性,设置输入字段的合法数字间隔
—
—
—
resize
控制是否能被用户缩放
string
none, both, horizontal, vertical
—
autofocus
原生属性,自动获取焦点
boolean
true, false
false
form
原生属性
string
—
—
label
输入框关联的label文字
string
—
—
tabindex
输入框的tabindex
string
-
-
input slot:
name
说明
prefix
输入框头部内容,只对 type=”text” 有效
suffix
输入框尾部内容,只对 type=”text” 有效
prepend
输入框前置内容,只对 type=”text” 有效
append
输入框后置内容,只对 type=”text” 有效
input 事件:
事件名称
说明
回调参数
blur
在 Input 失去焦点时触发
(event: Event)
focus
在 Input 获得焦点时触发
(event: Event)
change
在 Input 值改变时触发
(value: string 或 number)
input 方法:
方法名
说明
参数
focus
使 input 获取焦点
-
Autocomplete 属性:
参数
类型
说明
可选值
默认值
placeholder
输入框占位文本
string
—
—
disabled
禁用
boolean
—
false
value-key
输入建议对象中用于显示的键名
string
—
value
value
必填值,输入绑定值
string
—
—
debounce
获取输入建议的去抖延时
number
—
300
fetch-suggestions
返回输入建议的方法,仅当你的输入建议数据 resolve 时,通过调用 callback(data:[]) 来返回它
Function(queryString, callback)
—
—
popper-class
Autocomplete 下拉列表的类名
string
—
—
trigger-on-focus
是否在输入框 focus 时显示建议列表
boolean
—
true
name
原生属性
string
—
—
select-when-unmatched
在输入没有任何匹配建议的情况下,按下回车是否触发 select 事件
boolean
—
false
label
输入框关联的label文字
string
—
—
prefix-icon
输入框头部图标
string
—
—
suffix-icon
输入框尾部图标
string
—
—
Autocomplete slots:
name
说明
prefix
输入框头部内容
suffix
输入框尾部内容
prepend
输入框前置内容
append
输入框后置内容
Autocomplete 事件:
事件名称
说明
回调参数
select
点击选中建议项时触发
选中建议项