Зачем React Redux отправлять дважды при пожаре - PullRequest
4 голосов
/ 28 мая 2019

Государство

redux state

Результаты трассировки

redux trace dispatch

Каждый раз, когда я нажимаю кнопку, 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, результат все тот же.

Заранее спасибо.

Ref

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...