async await not working in composable function vue 3-CodePudding

In my project I have a function for downloading the files. When click the button the function onDownload will be called:

import {useOnDownload} from "../../use/useOnDownload"

setup() {

    ...

    const loading = ref(null)
    onDownload = (id) => {
        loading.value = id
        await useOnDownload(id)
        loading.value = null
    }
    
    return {loading, onDownload}
}

I refactored the code for api in a file useOnDownload.js call because the same code is used in another components as well.

export async function useOnDownload(id) {
    // make api call to server with axios
}

What I did wrong? I need to wait for the function useOnDownload ... in order the loader to work.

CodePudding user response：

onDownload must be async in order to use await within it

CodePudding user response：

You are using the await keyword in your onDownlaod function, but the function is not asynchronous. Here's how you should update it.

   // next line important
   onDownload = async(id) => {
    loading.value = id
    await useOnDownload(id)
    loading.value = null
}