Behavior while loading asynchronous data

[ethanclevenger91]

I'd like to give this thing a spinner or something while it's loading. Is there some way to v-if for empty data and render something else in the meantime?

[hnassr]

You can do something like this:

<i v-if="loading" class="fa fa-spin fa-spinner fa-3x"></i>

and fetchData method:

async fetchData({ page, filter, sort }) {
    this.loading = true;
    const response = await axios.get('/clients', {params: { page, filter, sort }});
    this.loading = false;
    return {
        data: response.data.clients.data,
        pagination: {
            currentPage: response.data.clients.current_page,
            totalPages: response.data.clients.last_page
        }
    };
}

[spatie-bot]

Dear contributor,

because this issue seems to be inactive for quite some time now, I've automatically closed it. If you feel this issue deserves some attention from my human colleagues feel free to reopen it.