无法在react-redux中调度事件

const increment = () => {
  return {
    type: 'INCREMENT',
  };
};

const counterReducer = (state = 0, action) => {
  switch (action.type) {
    case 'INCREMENT':
      return state + 1;
    default:
      return state;
  }
};

import { createStore, combineReducers } from 'redux';

const rootReducer = combineReducers({
  counter: counterReducer,
});

const store = createStore(rootReducer);

import { connect } from 'react-redux';

const Counter = ({ count, increment }) => {
  return (
    <div>
      <p>Count: {count}</p>
      <button onClick={increment}>Increment</button>
    </div>
  );
};

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

const mapDispatchToProps = (dispatch) => {
  return {
    increment: () => dispatch(increment()),
  };
};

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