Elementui 输入框自动提示搜索功能

这个功能是elementUI 自带的，搬过来就能用，提示内容后端获取就好了

这个功能是elementUI 自带的，搬过来就能用，提示内容后端获取就好了

html部分

<el-autocompleteclass="inline-input"v-model="state1":fetch-suggestions="querySearch"placeholder="请输入内容"@select="handleSelect"></el-autocomplete>

script部分

data(){return {state1: "" // 定义v-model}}querySearch(queryString, cb) {let dataList = [ // 也可以在后端接口动态获取{id: 1, value: "111"},{id: 2, value: "222"},{id: 3, value: "333"}{id: 4, value: "444"}]var results = queryString ? dataList.filter(this.createFilter(queryString)) : dataList;// 调用 callback 返回建议列表的数据cb(results);},createFilter(queryString) {return (restaurant) => {return (restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);};},handleSelect(item) {console.log(item);}

效果