Q-Select Autocomplete on object

Uneasy

I am having difficulties to make autocomplete work on dynamic object.
my Select looks like this :

<q-select
            label="Part Number"
            stack-label
            :value="items[data.key].partNo"
            :options="partNo"
            option-value="partNo"
            option-label="partNo"
            use-input
            outlined
            dense
            options-dense
            @filter="filterFn"
          />

And I have an Array with objects that looks like:

{
partNo: '123456',
orgName: 'xxxx',
partDesc: 'xxx' 
},
{
partNo: '143566',
orgName: 'xxxx',
partDesc: 'xxx' 
}
.
.
.

obviously function from example wont work:

    filterFn(val, update, abort) {
      console.log(val)
      update(() => {
        const needle = val.toLowerCase()
          this.partNo = this.partNo.filter(
            v => v.toLowerCase().indexOf(needle) > -1
          )
      })
    }

anyone have some nice ideas for that problem ?

metalsadman

@Uneasy pls produce a working reproduction codepen.

Uneasy

I did actually figured it out using lodash.
I had to create separate data called options or something and assign that to select options
here is my filtering function

filterFn(val, update, abort) {
      console.log(val)
      update(() => {
        const needle = val.toLowerCase()
          this.partsOptions = _.filter(this.partNo,function(o){
            return o.partNo.val.toLowerCase().indexOf(needle)>-1
          })
      })
    }