Call a function when the Loading Bar is displayed / hidden

Oxi

Hello, everyone,

I’ve discovered Quasar for myself and I’m excited. Now I’m hoping you can help me solve a problem.

I start an Axios call with a button click. The Loading Bar appears properly. But I’d like to disable the Send button until the Axios call is complete.

Since I’m using a Mixin, I can’t write the Disable function directly into the Axios call. My idea is to respond to the appearance of the Loading Bar. Or do you have a better idea?

Best regards
Oxi

<q-btn
    color="primary"
    icon="cloud"
    label="Load list"
     v-bind:loading="submitting"
     v-on:click="startAxiosCall"
/>

Idea: The variable “submitting” should be set to true as long as the loading bar is displayed.

The Docs say, there is already an event triggered:

Unfortunately, I don’t know how to react to it or intercept it or anything like that.

Oxi

I figured it out myself

The Ajax-Bar had to be integrated and the event had to be written in it.

https://quasar.dev/start/how-to-use-vue#Handling-Vue-Events
https://quasar.dev/vue-components/ajax-bar#Usage