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.