为什么在发生火灾时React Redux会调度两次

Question

  

国家

  

跟踪结果

每次单击按钮时，dispatch都会运行两次，如上图所示。

这是AppBar组件和mapDispatchToProps函数。

const mapStateToProps = state => {
  return {
    title: state.title
  };
};
const mapDispatchToProps = {
  onClick: () => {
    return {
      type: "TOGGLE_SIDEBAR"
    };
  } 
};

const AppBar = props => (
  <Box>
    <Button icon={<Notification />} onClick={props.onClick} />
  </Box>
);
const AppBatContainer = connect(
  mapStateToProps,
  mapDispatchToProps
)(AppBar);
export default AppBatContainer;

这是减速器

import {
  TOGGLE_SIDEBAR
} from "../constants/action-types";

const initialState = {
  showBar: false
};

const rootReducer = (state = initialState, action) => {
  switch (action.type) {

    case TOGGLE_SIDEBAR:
      return Object.assign({}, state, {
        showBar: !state.showBar
      });
    default:
      return state;
  }
};

export default rootReducer;

这是store.js

import { createStore, applyMiddleware, compose } from "redux";
import reduxThunk from "redux-thunk";
import rootReducer from "./reducers/index";

const composeEnhancers =
  typeof window === "object" && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
    ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({
        // Specify extension’s options like name, actionsBlacklist, actionsCreators, serialize...
        trace: true,
        traceLimit: 20
      })
    : compose;

const enhancer = composeEnhancers(applyMiddleware(reduxThunk));

const store = createStore(rootReducer, enhancer);

export default store;

所有库均已导入。我尝试删除redux-thunk，结果仍然相同。

谢谢。

参考

• React-Redux Counter example action firing twice我已经在stackoverflow上查看了这个问题，并尝试了答案，但是没有一个人解决了。