vuex-cache-plugin is a cache plugin when you try to cache data when you try to do a async function in actions.
we intercept the mutations payload using store.subscribe and next time dispatch we will get the data first and then do the dispatch.
the store
import createCachePlugin from 'vuex-cache-plugin'
const store = new Vuex.Store({
actions,
plugins: [createCachePlugin({
longTermCaching: true,
})],
})the actions
...
async fetchCodes({ commit }, payload) {
const res = await fetchInviteCode({ activityCode: payload.activityCode })
commit(FETCH_CODES, { ...res })
},
...now we can dispatch with cacheData props in payload
store.dispatch('fetchCodes', { cacheData: true })then we will get a mutation typed by the action types ,in this case it's FETCH_CODES the mutation
...
[FETCH_CODES](state, payload) {
state.code = payload.message
}
...MIT © asjoy