Q-Select filter an array of objects

[Salim Larhrib]

Hi everybody,
I have created a Q-Select component which filters array of objects.

<template>
  <q-select
    class="custom-selection"
    dense options-dense use-input
    v-model="innerValue"
    v-bind="$attrs"
    v-on="$listeners"
    :options="stringOptions"
    filter @filter="HandleFilter"
    hint="Minimum 3 characters to run filter"
  ></q-select>
</template>

Because of :options is binded to array of objects, I cannot use the quasar example filter. I have tried to do my own but I cannot access to this.$attrs.optionValue. Can somebody tell me how to reach this property or I have to bind it by hand in the props array ???

<script>
export default {
  name: 'SelectFilter',
  props: ['value', 'options'],
  data () {
    return {
      stringOptions: null
    }
  },
  computed: {
    innerValue: {
      get () {
        return this.value
      },
      set (value) {
        this.$emit('input', value)
      }
    }
  },
  methods: {
    HandleFilter (val, update, abort) {
      if (val.length < 3) {
        abort()
        return
      }
      update(() => {
        const needle = val.toLowerCase()
        this.stringOptions = this.options.filter(
          v => v[this.$attrs.optionValue].toLowerCase().indexOf(needle) > -1
        )
      })
    }
  }
}

Thank you.

[metalsadman]

@salim-larhrib this.$attrs['option-value'].