regular-redux-undo
Version:
the plugin of regular-redux to archieve undo and redo
92 lines (70 loc) • 1.62 kB
JavaScript
import Regular from 'regularjs';
import Rex from 'rgl-redux-undo';
import 'rgl-redux';
import { connect } from 'rgl-redux';
const store = new Rex.Store({
undoable: true,
state: {
count: 0
},
reducers: {
count(state, payload) {
let count = state.count;
count++;
return Object.assign({}, state, {count});
}
},
modifiers: [
function(reducer) {
return (state, action) => {
console.log(state, action)
let newState = reducer(state, action);
return newState;
}
}
],
modules: {
components: {
state: {
count: 1
},
reducers: {
componentsCount(state, payload) {
let count = state.count;
count++;
return Object.assign({}, state, {count});
}
}
}
}
});
const AppContainer = Regular.extend({
template: `
<StoreProvider store={store}>
<app/>
</StoreProvider>
`,
config(data) {
window.store = data.store = store;
},
});
let App = Regular.extend({
name: 'app',
template: '<div>count: {count}</div><button on-click={this.onClick()}>count</button><button on-click={this.$dispatch("undo")}>undo</button><button on-click={this.$dispatch("redo")}>redo</button>',
onClick() {
this.$dispatch('componentsCount');
},
config() {
setTimeout(() => this.$dispatch('@init/state'), 100)
}
});
App = connect({
mapState(state) {
console.log(state)
return {
count: state.components.count,
};
},
dispatch: true
})(App);
new AppContainer({}).$inject(document.getElementById('app'));