Skip to content

Scrum/vue-axillo

Repository files navigation

vue-axillo

Composable Axios for REST API with query notation GraphQL

Actions Statusnodenpm versionXO code styleCoveralls status

npm downloadsnpm

Why?

Axillo is a set of tools effort to help you use REST API in your apps. It's well known for its client and its server.

All queries use rexios utils normalize url, data, params for axios when using REST API request

Install

$ npm install vue-axillo

Note: This project is compatible with node v10+

Usage

Query

For query requests the get method is used by default

import axillo from 'vue-axillo'; export default { setup() { const { query, // query method loading, // request status result: users // reactive data } = axillo({ baseURL: 'v2/api/user/' }); async function submit() { await query(/* params */); // => request on 'v2/api/user/' } return { submit, loading, users, } } }

Query with params

import axillo from 'vue-axillo'; export default { setup() { const { query, // query method loading, // request status result: users // reactive data } = axillo({ baseURL: 'v2/api/user/' }); async function submit() { await query({ id: 123, article: 1, }); // => request on 'v2/api/user/123/?article=1' } return { submit, loading, users, } } }

Query with reactive params

import axillo from 'vue-axillo'; import { ref, watch } from 'vue' // vue 3 or composition-api export default { setup() { const name = ref(null); const { params: searchByName, // params for query loading, // request status result: users // reactive data } = axillo({ baseURL: 'v2/api/user/' }); watch(name, value => { searchByName.value = value; }); return { loading, users, } } }

Mutate

For mutate requests the post method is used by default

import axillo from 'vue-axillo'; export default { setup() { const { mutate, // mutate method loading, // request status onDone, // suceess callback onError, // error callback } = axillo({ baseURL: 'v2/api/user/' }); function submit() { mutate({ name: 'Scrum' }); } onDone(response) { console.log(`User ${response.name} created.`); } return { submit, loading, } } }

Options

baseURL

Type: String required
Default: null
Description: URL api used at query mutation

method

Type: String
Default: get|post
Description: for query requests the get method is used by default, for mutate requests the post method is used by default

apiClient

Type: Function
Default: Axios
Description: HTTP client

About

Composable Axios for REST API with query notation GraphQL

Topics

Resources

License

Stars

Watchers

Forks

Sponsor this project

Packages

No packages published