时间戳

首页 > 解决方案 > vuetify的selects组件可以支持查询功能吗？

vuetify.js - vuetify的selects组件可以支持查询功能吗？

问题描述

我已经阅读了所有关于选择组件的 api 的 api。似乎没有来自 itemlist 的道具支持 quert 函数

有一个名为“过滤器”的道具，但我不知道如何使用它

 <v-select
          v-model="activity.scs"
          :items="statement"
          item-text="name"
          item-value="id"
          label="Select"
          persistent-hint
          return-object
          multiple
          chips
          deletable-chips
          clearable
          counter
          filter
          >
</v-select>

标签： vuetify.js

解决方案

是的，可以使用过滤器属性查询选择搜索结果

像这样使用：

在选择组件中添加过滤器属性

<v-select
          v-model="activity.scs"
          :items="statement"
          item-text="name"
          item-value="id"
          label="Select"
          persistent-hint
          :filter="selectFilter"
          return-object
          multiple
          chips
          deletable-chips
          clearable
          counter
          filter
          >
</v-select>

在方法中

selectFilter(item, queryText) {   
  queryText = queryText.toLowerCase();

  return item.name.toLowerCase().indexOf(queryText) > -1 || item.id.toLowerCase().indexOf(queryText) > -1; 
}

这样，您可以使用自定义过滤器来搜索项目对象中的所有属性

推荐阅读