Vue el-autocomplete远程搜索下拉框并实现自动填充功能(推荐)

<el-autocomplete 
 placeholder="请输入studentID"
 v-model="form.studentID" 
 :fetch-suggestions="querySearchAsync" 
 @select="handleSelect" 
>
</el-autocomplete>

//queryString 为在框中输入的值
//cb 回调函数，将处理好的数据推回
querySearchAsync(queryString, cb) {
 var studentBasic = this.studentBasic;
 console.log(studentBasic)
 var results = queryString ? studentBasic.filter(this.createStateFilter(queryString)) : studentBasic;
 console.log('results '+results)
 clearTimeout(this.timeout);
 this.timeout = setTimeout(() => {
  cb(results);
 }, 0.5*1000);
 },
//根据输入的字段进行筛选
createStateFilter(queryString) {
 return (state) => {
 return (state.value.toString().toLowerCase().indexOf(queryString.toLowerCase()) === 0);
 };
 },

//将其他数据自动补全，采用覆盖的方法
handleSelect(item){
 this.form.name = item.name;
 this.form.studentID = item.value;
 this.form.birth = item.birthday;
 this.form.region = item.city;
 this.form.phone = item.phone;
 }

this.studentBasic= JSON.parse(JSON.stringify(this.list).replace(/studentID/g,"value"));