I'm having a problem sending the value of a select to my database. I'm using Vue, quasar and typescript.

I have a modal with name and age inputs, in addition I have a select that selects a category. But, when sending this select value to the database, an object is sent with the label and value of the select. But the database would only accept it if it was a numeric value.

const baseFieldStates = {
  name: '',
  age: '',
  category:  null,
};
//@ts-ignore
const fieldStates: Ref<UserFormData> = ref({
  ...baseFieldStates,
  ...props.userData
});

Here would be my function to save a user and send their data.

const userAction = props.userData ? editUser : createUser
const saveUser = () => {
  userAction(fieldStates.value)
    .then(() => {
      onDialogOK(fieldStates.value);
    })
    .catch(() => {
      onDialogCancel();
    })
};

My select:

          <q-select
            outlined
            class="q-mb-lg"
            :options="rolesOptions"
            option-value="value"
            option-label="label"                
            :label="$t('Users.form.role')"
            v-model="fieldStates.category"
          />

This is an example of how my select is sent to the database.

{label: 'Example', value: 1}