Loading: true
Finished: false
TIP
available in add-on @vueuse/integrations
useAxios
wrapper for axios
Install
npm i axios
Usage
import { useAxios } from '@vueuse/integrations/useAxios'
const { data, isFinished } = useAxios('/api/posts')
or use an instance of axios
import axios from 'axios'
import { useAxios } from '@vueuse/integrations/useAxios'
const instance = axios.create({
baseURL: '/api'
})
const { data, isFinished } = useAxios('/posts', instance)
use an instance of axios with config options
import axios from 'axios'
import { useAxios } from '@vueuse/integrations/useAxios'
const instance = axios.create({
baseURL: '/api'
})
const { data, isFinished } = useAxios('/posts', { method: 'POST' }, instance)
Type Declarations
export interface UseAxiosReturn<T> {
/**
* Axios Response
*/
response: Ref<AxiosResponse<T> | undefined>
/**
* Axios response data
*/
data: Ref<T | undefined>
/**
* Indicates if the request has finished
*/
isFinished: Ref<boolean>
/**
* Indicates if the request is currently loading
*/
isLoading: Ref<boolean>
/**
* Indicates if the request was canceled
*/
aborted: Ref<boolean>
/**
* Any errors that may have occurred
*/
error: Ref<AxiosError<T> | undefined>
/**
* Aborts the current request
*/
abort: (message?: string | undefined) => void
}
export declare function useAxios<T = any>(
url: string,
config?: AxiosRequestConfig
): UseAxiosReturn<T>
export declare function useAxios<T = any>(
url: string,
instance?: AxiosInstance
): UseAxiosReturn<T>
export declare function useAxios<T = any>(
url: string,
config: AxiosRequestConfig,
instance: AxiosInstance
): UseAxiosReturn<T>