1.0.3 • Published 6 years ago

vue-rest-resource v1.0.3

Weekly downloads
2
License
MIT
Repository
github
Last release
6 years ago

vue-rest-resource

A base class for accessing REST APIs in object-oriented way. Backed by axios.

Installation

Add package

yarn add vue-rest-resource

Usage

Import Resource class and instantiate with endpoint URL:

import Resource from 'vue-rest-resource';

const usersResource = new Resource('/api/users');

// use any of provided methods:
const user = await usersResource.get(1);

// create user
await usersResource.create(userData);

// update user
await usersResource.partialUpdate(userId, userData);

Global settings

You may set global options to Resource class:

Change axios client instance

by default, Resource class creates a new instance of axios. You still able to override it by:

import Resource from 'vue-rest-resource';
import axios from 'axios';

const myAxios = axios.create();
Resource.client = myAxios;
Force trailing slash

some framworks (eg. Django) may require a trailing slash for requests. appendSlash setting ensures this rule.

import Resource from 'vue-rest-resource';
import axios from 'axios';

Resource.appendSlash = true;

Override global setting instance

const resource = new Resource('/api');
resource.withClient(myAxios);
resource.withAppendSlash(false);

resource.create();

latter calls localhost:8000/api using myAxios client.

Extend with own methods

Extend class and implement your own custom actions:

class UsersResource extends Resource {
    async setActive(userId, flag) {
        const url = this.url(userId);
        return this.update(url, {isActive: flag})
    }
    
    async setStatus(userId, status) {
        // access underlying client API
        const url = this.url(userId);
        return Resource.client.post(url, status)
    }
}

// instantiate and use
const users = new UsersResource('/api/users');
users.setActive(100, true)

Helper methods

Make an URL with url(...args): string

Use Resource.url functions to build an URL:

// in some resource class method
// assuming: appendSlash = true, userId = 10
this.url(['users', userId, 'create']) 
// /users/10/create/

Class method to REST action map

MethodREST
get(objectId)GET
list()GET
create(data)POST
delete(objectId)DELETE
update(objectId, data)PUT
partialUpdate(objectId, data)PATCH
createOrUpdate(objectId, data)PUT or POSTIf id in data, calls update otherwise `create
createOrPartialUpdate(objectId, data)PATCH or POSTIf id in data, calls partialUpdate otherwise `create
1.0.3

6 years ago

1.0.2

6 years ago

1.0.1

6 years ago

1.0.0

6 years ago