前兩天做了個(gè)功能,實(shí)現(xiàn)element-select在多選模式下能搜索,看了官方文檔沒(méi)有相應(yīng)的方法和屬性,現(xiàn)在復(fù)盤(pán)一下
1.el-select在多選模式下是不支持搜索的郊尝,所以在下拉框里加入input框
2.一開(kāi)始想在input框輸入內(nèi)容的時(shí)候進(jìn)行遠(yuǎn)程搜索的,經(jīng)過(guò)嘗試發(fā)現(xiàn)战惊,如果先有選中值流昏,然后input框輸入進(jìn)行搜索,搜索出來(lái)的列表中不包含之前選中值,之前選中值就會(huì)變成它的value值况凉,所以遠(yuǎn)程搜索這個(gè)方式排除掉了谚鄙。。刁绒。闷营。
3.遠(yuǎn)程搜索不行,那就用本地搜索+v-show來(lái)搞定(v-if是不行的知市,v-if把節(jié)點(diǎn)去掉了傻盟,還是會(huì)出現(xiàn)上面2的情況)
? ? (1)html代碼
圖1-1
? ? (2)在input搜索框的事件里進(jìn)行本地搜索,給滿足條件的加變量
圖1-2
(3)成功后的效果
圖1-3