there is a problem with the operation of dva GitHub demo
document address
https://github.com/dvajs/dva/.
problem description
here is the code for the document, without any changes. npm start
after reducers add
does not play a role, only effects add
works. The number of the resulting problem will be subtracted by 1 after clicking the button for 1 second, but will not be added by 1, and the highest score will always be 0
import dva, { connect } from "dva";
import { Router, Route } from "dva/router";
import React from "react";
import styles from "./index.less";
import key from "keymaster";
const app = dva();
app.model({
namespace: "count",
state: {
record: 0,
current: 0,
},
reducers: {
add(state) {
const newCurrent = state.current + 1;
return { ...state,
record: newCurrent > state.record ? newCurrent : state.record,
current: newCurrent,
};
},
minus(state) {
return { ...state, current: state.current - 1};
},
},
effects: {
*add(action, { call, put }) {
yield call(delay, 1000);
yield put({ type: "minus" });
},
},
subscriptions: {
keyboardWatcher({ dispatch }) {
key("+up, ctrl+up", () => { dispatch({type:"add"}) });
},
},
});
const CountApp = ({count, dispatch}) => {
return (
<div className={styles.normal}>
<div className={styles.record}>Highest Record: {count.record}</div>
<div className={styles.current}>{count.current}</div>
<div className={styles.button}>
<button onClick={() => { dispatch({type: "count/add"}); }}>+</button>
</div>
</div>
);
};
function mapStateToProps(state) {
return { count: state.count };
}
const HomePage = connect(mapStateToProps)(CountApp);
app.router(({history}) =>
<Router history={history}>
<Route path="/" component={HomePage} />
</Router>
);
app.start("-sharproot");
// ---------
// Helpers
function delay(timeout){
return new Promise(resolve => {
setTimeout(resolve, timeout);
});
}