ElementUI 輸入框模糊搜尋資料處理的坑

2022-06-11 11:48:09 字數 849 閱讀 4315

前言:

最近在遇到乙個需求,輸入框(input)模糊搜尋的功能,我用到的是elementui的el-autocomplete>元件,但是在使用的過程中遇到了一些坑,分享一下

坑1:

根據官方提供的方法

querysearch(querystring, cb) 

customerorderapi.getumlist(params).then(res => )

},createfilter(querystring) ;

},

但是資料死活載入不出來一直是這個狀態

最後我發現後台返回給我的資料型別是

["火雞面","粗麵"]

但是官方給的資料型別是

[,]解決:

所以最後通過改變資料型別解決

querysearch(querystring, cb) 

customerorderapi.getumlist(params).then(res => )

*/ var restaurants = arr;

var results = querystring ? restaurants.filter(this.createfilter(querystring)) : restaurants;

// 呼叫 callback 返回建議列表的資料

cb(results);

})},

Element UI的復合輸入框應用

工作需求 應用復合輸入框支援右側下拉選項 左側支援輸入 當左側輸入時候右側下拉清空 如下 html 請輸入應用鏈結 value datadetail.url class input width select style width 80 focus getvalue input changinput...

vue輸入框使用模糊搜尋

實現原理 利用js的 indexof 方法可返回某個指定的字串值在字串中首次出現的位置。模板中的 class search input autosearch v model value placeholder style width 90 display inline block 搜尋span di...

HTML中input輸入框動態模糊匹配

html中的input輸入框根據後台返回的動態模糊匹配輸入的內容,可以選擇,也可以輸入,此處是使用的是html5新增的標籤datalist來實現,不需要外掛程式,頁面載入完時直接將後台查詢到的所有值賦給datalist,還有一種是輸入框中有改變時都呼叫介面向後台查詢一次,返回給前台,這裡先不做介紹。...