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.