1.0.1 • Published 5 years ago
track-pending-request v1.0.1
track-pending-request
Generate a vuex module to track async requests 'pending' status.
When you send a request to one of the registered endpoints or receive a response from one of them, this package set the proper 'pending' state value through axios interceptors.
Installation
npm i track-pending-request --save
Usage
Example
register package
import trackPendingRequestInstall from 'track-pending-request'
import axios from 'your/axios-config/path'
const store = new Vuex.Store({
modules: {
//your store modules
}
});
//You need to install the package with your axios instance and your vuex store.
//Optionally you can define the desired store namspace it should use (default is 'trackPendingRequest').
trackPendingRequestInstall({axios, store, /* 'desiredStoreNamesapce' */});
export default store;
axios-config
import axios from 'axios'
const instance = axios.create({
//your config
});
instance.endpoints = {
request1: '/xxx/endpoint1'
request2: '/yyy/endpoint2'
request3: '/endpoint3'
};
//You need to define a 'trackPendingRequest' property on your
//axios instance with the endpoints you would like to track
instance.trackPendingRequest = [
instance.endpoints.request1 //we would like to track pending status only for '/xxx/endpoint1' requests
];
export default instance;
vue component
...
computed: {
isRequest1Pending() {
return this.$store.getters['trackPendingRequest/xxxEndpoint1']();
},
}
...