1.0.5 • Published 4 years ago
vuex-xhr-state v1.0.5
Vuex xhr state
Use Vuex to manage the state of you're ajax calls.
- Keep data from ajax calls in your Vuex store
- Track the state of an individual network load calls in your Vuex store
- Only fetch data when needed and not already fetching
This package is still in development.
#instalation
npm
npm install vuex-xhr-state
yarn
yarn add vuex-xhr-state
Example
Could be outdated and incomplete feel free to ask questions on gitter (ricky-rick) or e-mail
Store module file logs/index.js
export const xhrLogList = new VuexXhrGet({
method: (id) => { return api.getAllLogs(id) },
default: [],
cache: true,
store: {
...
},
})
export const logs = new VuexXhrCreator('logs', [ xhrLogList ])
Store
import VueXhrState from 'vuex-xhr-state'
import { logs } from './logs/'
Vue.use(VueXhrState)
const xhrPlugins = [
logs,
]
export default new Vuex.Store({
plugins: [
...xhrPlugins.map((plugin) => plugin.plugin()),
],
})
Component
import { mapActions } from 'vuex'
import { xhrLogList } from '@/store/logs'
import { mapXhrGetters } from 'vuex-xhr-state'
export default {
computed: {
...mapXhrGetters({
logs: xhrLogList.mapData(),
isLoading: xhrLogList.mapPending(),
}),
isLoading: function () {
return xhrLogList.pending(this.$store.getters)
},
},
methods: {
...mapActions({
fetchLogs: xhrLogList.fetch(),
forceReload: xhrLogList.forceFetch(),
}),
},
created () {
this.fetchLogs()
/**
* or with custom error handling
* if the closure returns true the error will not apear in the global VXS store
*/
const errorHandler(error => {
return true
})
this.fetchLogs({ errorHandler })
},
}
1.0.5
4 years ago
1.0.4
5 years ago
1.0.3
5 years ago
1.0.2
5 years ago
1.0.1
5 years ago
1.0.0
5 years ago
0.3.2
5 years ago
0.3.1
5 years ago
0.3.0
5 years ago
0.2.17
5 years ago
0.2.16
5 years ago
0.2.15
5 years ago
0.2.14
5 years ago
0.2.13
5 years ago
0.2.12
5 years ago
0.2.11
5 years ago
0.2.10
5 years ago
0.2.9
5 years ago
0.2.8
5 years ago
0.2.7
5 years ago
0.2.6
5 years ago
0.2.5
5 years ago
0.2.4
5 years ago
0.2.3
6 years ago
0.2.2
6 years ago
0.2.1
6 years ago
0.2.0
6 years ago
0.1.1
6 years ago
0.1.0
6 years ago
0.0.14
6 years ago
0.0.13
6 years ago
0.0.12
6 years ago
0.0.11
6 years ago
0.0.10
6 years ago
0.0.9
6 years ago
0.0.8
6 years ago
0.0.7
6 years ago
0.0.6
6 years ago
0.0.5
6 years ago