vue element 模糊查询 输入提示框

vue element 输入提示框

如果你想做一个模糊查询的下拉 搜索框 那你来对了
简单的我就不说了 点链接 看文档
http://element.eleme.io/#/zh-CN/component/input

下面是我的例子

requestregion() 是我请求后台数据的接口
因为后台数据 返回过来的数据不是value 类型 我用循环拿到我想要的格式
其中this.bb=(item.id) 就是当前文本框内的 id

下面是具体代码

// An highlighted block
 querySearchAsync(queryString, cb) {
  let likeThis=this;
  let areaKey= {
    "Condition": {
      "LBLongitude": "",
      "LBLatitude": "",
      "RTLongitude": "",
      "RTLatitude": "",
      "Key": this.addForm.controlArea
    },
    "Page": 1,
    "Size": 2
  };
 requestregion().then(data => { 
    
   this.loadAl = data.data
    let correctAreaNames=[];
    let  createFilter=[];
    for(let i=0;i<this.loadAl.length;i++){
        correctAreaNames.push({id: this.loadAl[i].id,value: this.loadAl[i].name})
    }
    likeThis.areaNames=correctAreaNames;
    let areaNames = likeThis.areaNames;
    console.log(areaNames)
    
    let results = queryString ? areaNames.filter(likeThis.createFilter(queryString)) : areaNames;
    // 调用 callback 返回建议列表的数据
    cb(results);
  });
      },
      createFilter(queryString) {
        return (areaNames) => {
          return (areaNames.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0 );
          
        };
      },
      handleSelect(item) {
			this.bb=(item.id)
			console.log(this.bb)
			     },
		},