antd 搜索输入框 模糊搜索

1,487 阅读1分钟

image.png

image.png

具体代码:

    <gmd-select
      v-decorator="['topic']"
      placeholder="请选择Banner名称"
      show-search
      style="width:200px;"
      @search="filterItem"
    >
      <gmd-select-option
        v-for="(item,index) in bannerTitleArr"
        :key="index"
        :value="item"
      >
        {{ item }}
      </gmd-select-option>
    </gmd-select>
 </gmd-form-item>
  const res = await api.active.bannerSearch({
    page: 1,
    limit: 999,
    objects: {},
  });
  this.itemData = res.data.records.map(item => item.topic);
  this.itemData = Array.from(new Set(this.itemData));
  this.bannerTitleArr = this.itemData.slice(0, 49);
},

//输入模糊搜索

  if (val == '') return this.bannerTitleArr = this.itemData;;
  this.bannerTitleArr = filter(this.itemData, item => {
    if (item.indexOf(val) != -1) {
      return true;
    }
  }).slice(0, 2);
},