vuex-cache

vuex cache action

When vuex action fetch some data by request remote api, vuex-cache can store the action result, when next time the same action runs, it will not make a new request and just return the cached result.

Compatibility

• Any Vue version, since vuex-cache just deals with Vuex
• Vuex versions 1, 2 and 3

install

npm install vuex-cache

usage

import Vuex from 'vuex'
import vuexCache from 'vuex-cache'
const store = new Vuex.Store({
  state: {
    ...
  },

  plugins: [vuexCache],

  mutations: {
    ...
  },

  actions: {
    ...
  }
})

store.cache.dispatch('LIST')

api

NOTICE: after update to 1.0.0, main api is different from the previous version 0.3.1

1.0.0 need your env has Map object, or import Map from babel-polyfill

thanks VitorLuizC

store.cache.dispatch(ACTION_NAME)

params is same with vuex store.dispatch

cacheDispatch will cache the result, so do not use it to make some actions with different params, when params change, cacheDispatch would still return the first cached result, and the data in store will not change.

store.cache.delete(ACTION_NAME)

remove cached action, will not remove the data in store. when call cacheDispatch with same type, the request in that action will run again.

store.cache.has(ACTION_NAME)

return bool if ACTION_NAME has been cached

store.cache.clear()

clear all cached keys

Changelog

1.0.1

• Remove Vue and Vuex peer dependencies.

  This is added on PR #3 and fixes issue #2.