import React, { Component } from 'react';
class App extends Component {
componentDidMount() {
console.log(this.props.store);
}
Increment = () => {
const {value} = this.selectNumber;
this.props.store.dispatch({type: 'increment',data: value*1})
};
Decrement = () => {
const {value} = this.selectNumber;
this.props.store.dispatch({type: 'decrement',data: value*1})
}
IncrementIfOdd = () => {
const {value} = this.selectNumber;
const count = this.props.store.getState();
if (count % 2 !== 0) {
this.props.store.dispatch({type: 'increment',data: value*1});
}
}
IncrementAsync = () => {
const {value} = this.selectNumber;
setTimeout(() => {
this.props.store.dispatch({type: 'increment',data: value*1});
},1000)
}
render() {
const count = this.props.store.getState();
return (
<div>
<h1>当前求和为:{count}</h1>
<select ref={c => this.selectNumber = c}>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<button onClick={this.Increment}>+</button>
<button onClick={this.Decrement}>-</button>
<button onClick={this.IncrementIfOdd}>奇数则+</button>
<button onClick={this.IncrementAsync}>异步+</button>
</div>
);
}
}
export default App;