jarvelov/vue-form-json-schema

Event filter QSelect

piovezanfernando opened this issue · 5 comments

Hello, first I would like to thank you and say that this project helps me a lot.
But I am facing a problem that I believe can help me.
I am using vue-form-json-schema in conjunction with Quasar and its components, I am facing a problem with the QSelect component more specifically in the @filter event. this event drops the value entered together with a callback function and an abort function, but I can't pass the callback function at all, as I have tested it in several ways that I could remember but I couldn't get there.
Here are the code snippets I'm using.
QSelect component

{
  component: 'q-select',
  model: 'vehicle_types',
  fieldOptions: {
    on: {
       filter: (value, update) => this.getVehicleTypes(value, update)
      },
    attrs: {
      id: 'vehicle_types',
      name: 'vehicle_types',
    },
    props: {
      label: 'Type',
      outlined: true,
      options: this.vehicleTypesOptions,
      optionValue: 'id',
      optionLabel: 'name',
      multiple: true,
      emitValue: true,
      useChips: true,
      useInput: true,                          
    }                 
  }
},

function getVehicleTypes

methods: {
  getVehicleTypes(val, update) {
    //I'm just giving a console.log () to check if the two values are arriving with should arrive
    console.log(val, update)
  }
},

property vehicleTypesOptions

vehicleTypesOptions: [
  {
      "id": 12,
      "name": "Test 01"
  },
  {
      "id": 17,
      "name": "Test 02"
  },
  {
      "id": 19,
      "name": "Test 03"
  }
]

And there's the link to the quasar documentation where I'm trying to replicate the use of the component
Doc Quasar

I would appreciate it very much if you could help me with this problem.
Thank you

Hi Fernando,

I see your problem but I don't have time to whip up an example with a solution right now, I'll get back to you later today or tomorrow.

Hello jarvelov, I managed to reproduce the error in the codesandbox, I believe that this way it will be easier for you to analyze the code.

Follow the code link

Test CodeSandbox

Hi, thanks for the codesandbox reproduction.

I'm on my mobile phone right now but I think I've narrowed down the error and it seems like the wrapper function for the event handlers only receives the first param, which is why the second param is undefined.

It should be a very simple fix, I should be able to publish a new release with a fix as soon as I get home.

Hello Fernando,

I just released v2.8.7 which includes the patch I talked about yesterday. I forked your codesandbox and I can now see that the update function is passed to the filter function.

Let me know how things work out.

Hi jarvelov, man it worked perfectly now with this update, thank you very much for the quick solution you presented for this problem.

I updated the sandbox and it is already possible to see the operation, as soon as I finish the function I complement the example and make it more functional for those who know how to be able to serve for other people

Thank you very much