[element-ui] 多列表实现+自定义过滤 el-select

Posted 2021-06-09 o2i

自定义多列表，自定义过滤

 <el-select size="mini"  v-model="form.code" filterable :filter-method=\'filterMethod\' clearable placeholder="请选择">
    <el-option v-for="item in options" :key="item.dictValue" :label="item.dictLabel" :value="item.dictValue">
         <template>
           <el-row type="flex">
             <div style="padding-right:20px">{{item.dictValue}}</div>
             <div>{{item.dictLabel}}</div>
           </el-row>
         </template>
    </el-option>
</el-select>

过滤函数

        filterMethod(query) {
            if (query == \'\') {
                this.options= this.list
            }
            else {
                let result = []
                this.list.forEach(item => {
                    if (item.dictValue.includes(query)) result.push(item)
                })
                this.options= result
            }
        },