VueUse
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 erros 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>

 Source
Source • Demo • Docs