vue.jsvue-select

Vue Select - Also search in Meta-Data

Trying to add vue-select to my vue app I have the following code:

  <v-select :options="options" label="country" :reduce="country => country.meta.code" v-on:input="set"/>

The options look as follows:

[
  {
    country: 'canada',
    meta: {
      code: 'ca',
      tags: ['sky', 'plain'],
        provinces: ['foo']
      }
  },
  {
    country: 'New York',
    meta: {
      code: 'ze',
      tags: ['water', 'boat'],
      provinces: ['bar']
   }
  }
]

Now I want to search an option by meta-data so that e.g. entering the string sky the option canada gets selected.

Is that possible and if, how?

Solution

  • I now find the solution. It is possible to customize the filter with fuse:

    https://vue-select.org/guide/filtering.html#filtering-with-fuse-js