1.0.1 • Published 5 years ago
vuex-redo-undo v1.0.1
vuex-history
a history plugin for vuex that allows you to undo or redo the store history.
installation
npm i --save-dev vuex-rado-undo
module
import history from 'vuex-redo-undo'
usage
use it as same as vue plugin, and pass the store as a params of plugin.
import store from './store'
Vue.use(history, store)
you must, of course, add the mutation of updatehistory in your vuex store,like this:
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
const store = new Vuex.Store({
mutations: {
updateHistory (state, data) {
if (data) {
// change
for (let key in data) {
Vue.set(state, key, data[key])
}
// delete
for (let key in state) {
if (typeof data[key] === 'undefined') {
Vue.delete(state, key)
}
}
}
}
}
})
export default store
whenever you need to create a record of history you need to call the method of update
manual.
in the majority of cases we need to record the initial history of our application,like:
mounted () {
this.$history.update()
}
Api
Methods
update
record the history
undo
undo the history
redo
redo the history
hasUndo
check if has undo steps
hasRedo
check if has undo steps