Fetch

Component name: <v-fetch>

A simple, declarative, and composable way to fetch data.

API

Name Type Description Default
url String URL of the resource you want to fetch. The response must be valid JSON.
with-credentials Boolean By default, cookies will not be sent or received, resulting in unauthenticated requests if the site relies on maintaining a user session. This setting allows both CORS and same origin requests to work with cookies. false

Scoped Slot

In order to access the fetched data, we're exposing a response object using Scoped slots.

The response object contains the following information:

Name Type Description
loading Boolean Indicates wether or not data is loading.
status Number Contains the status code of the response, e.g. 404 for a not found resource, 200 for a success.
data Object The (deserialized) JSON response that was provided by the server.

Example: Simple

In the following example we are fetching a list of repositories (limited to 5) from the Vue.js Github organisition.

Example: Loop

In the following example we are fetching and looping through a list of repositories (limited to 10) from the Vue.js Github organisition.