搜索框

<el-row style="text-align: left;margin-bottom: 20px">
    <el-col :span="16">
        <el-input v-model="mySearch" size="small" placeholder="请输入内容" class="input-with-select"/>
    </el-col>
</el-row>

展示筛选内容

<el-checkbox-group v-model="checkList">
   <el-row v-for="(item,index) in dataSource" :key="index" style="margin: 10px">
      <el-checkbox :label="item.id" style="color:#d1d1d1;">{{ item.label }}</el-checkbox>
   </el-row>
</el-checkbox-group>
 

使用计算属性和filter筛选

使用computed计算属性来定义筛选后的数组dataSource

  computed: {
    dataSource() {
      return this.dicts.filter(k => {
        return k.label.match(this.mySearch)
      })
    }
  }

dicts为需要筛选的数组 mySearch为输入的关键词

返回值即为筛选后的数组