如何过滤与 vuetify v-data-table 的完全匹配？

Question

我正在尝试制作自定义过滤器以仅获得完全匹配

如果我搜索的是歌剧而不是歌剧，我希望过滤器 return 歌剧 :

歌剧
操作
希望

如何使用自定义过滤器的示例： https://vuetifyjs.com/en/components/data-tables/#custom-filter

目前我有：

<v-data-table
        :headers="headers"
        :items="words"
        item-key="name"
        :search="search"
        :custom-filter="filterPerfectMatch"
      >
...
</v-data-table>

...

methods: {
    filterPerfectMatch(value, search) {
      return value != null &&
        search != null &&
        typeof value === 'string' &&
      //  value.match(search) === true &&  <== doesn't work T T
        value.toString().indexOf(search) !== -1
    },
},

Answer 1

发现这很容易 af:

 filterPerfectMatch(value, search) {
      if (value == search) {
        console.log("value :" + value + ", search :" + search)
        return value != null &&
        search != null &&
        typeof value === 'string' &&
        value.toString().indexOf(search) !== -1
      }

      
    },

Answer 2

如果您想要完全匹配，请使用 == 或 === 进行字符串比较。无需使用 indexOf.

methods: {
    filterPerfectMatch(value, search) {
      return value != null && value === search
    },
},

您还可以将 toLowercase() 添加到值和搜索中，但您需要添加检查它们是否返回字符串。

如何过滤与 vuetify v-data-table 的完全匹配？

How to filter exact mach with vuetify v-data-table?

filter

vue.js

vuetify.js

v-data-table