将计数器添加到redux状态

const INCREMENT_COUNTER = 'INCREMENT_COUNTER';
const DECREMENT_COUNTER = 'DECREMENT_COUNTER';

function incrementCounter() {
  return {
    type: INCREMENT_COUNTER,
  };
}

function decrementCounter() {
  return {
    type: DECREMENT_COUNTER,
  };
}

function counterReducer(state = 0, action) {
  switch (action.type) {
    case INCREMENT_COUNTER:
      return state + 1;
    case DECREMENT_COUNTER:
      return state - 1;
    default:
      return state;
  }
}

import { createStore } from 'redux';

const store = createStore(counterReducer);

import { connect } from 'react-redux';

function CounterComponent({ counter, incrementCounter, decrementCounter }) {
  return (
    <div>
      <p>Counter: {counter}</p>
      <button onClick={incrementCounter}>Increment</button>
      <button onClick={decrementCounter}>Decrement</button>
    </div>
  );
}

const mapStateToProps = (state) => ({
  counter: state,
});

const mapDispatchToProps = {
  incrementCounter,
  decrementCounter,
};

export default connect(mapStateToProps, mapDispatchToProps)(CounterComponent);