1const INCREMENT = "INCREMENT"; // define a constant for increment action types
2const DECREMENT = "DECREMENT"; // define a constant for decrement action types
3
4// define the counter reducer which will increment or decrement the state based on the action it receives
5const counterReducer = (state = 0, action) => {
6 switch (action.type) {
7 case INCREMENT:
8 return state + 1;
9
10 case DECREMENT:
11 return state - 1;
12
13 default:
14 return state;
15 }
16};
17
18// define an action creator for incrementing
19const incAction = () => {
20 return {
21 type: INCREMENT
22 };
23};
24
25// define an action creator for decrementing
26const decAction = () => {
27 return {
28 type: DECREMENT
29 };
30};
31
32// define the Redux store here, passing in your reducers
33const store = Redux.createStore(counterReducer);
34
1import React from 'react';
2
3class Counter extends React.Component {
4 state = { count: 0 }
5
6 increment = () => {
7 this.setState({
8 count: this.state.count + 1
9 });
10 }
11
12 decrement = () => {
13 this.setState({
14 count: this.state.count - 1
15 });
16 }
17
18 render() {
19 return (
20 <div>
21 <h2>Counter</h2>
22 <div>
23 <button onClick={this.decrement}>-</button>
24 <span>{this.state.count}</span>
25 <button onClick={this.increment}>+</button>
26 </div>
27 </div>
28 )
29 }
30}
31
32export default Counter;
33