当单击redux按钮时，页面是否未重新渲染？

Question

我在玩redux。 所以npm install, npm start 它将弹出一个简单的单击按钮。

当我单击按钮时，它不会重新呈现主页。例如它应该输出1

Home.Container

import { connect } from "react-redux";
import { homeClickAction } from "./home.action";
import Home from "./Home";

const mapStateToProps = state => {
  return {
    homeClick: state.homeReducer.homeClick
  };
};

// const var
// dispatch
// return
// key
// data => { fire(actionCreator(data)) }
const mapDispatchToProps = dispatch => {
  return {
    homeClickAction: data => {
      dispatch(homeClickAction(data));
    }
  };
};

const HomeContainer = connect(
  mapStateToProps,
  mapDispatchToProps
)(Home);

export default HomeContainer;

---

商店

// store
import { createStore, applyMiddleware } from 'redux';

// thunk
import thunk from 'redux-thunk';

// root reducer
import rootReducer from './rootReducer';

// store
export default function configureStore() {
    return createStore(
        rootReducer,
        applyMiddleware(thunk)
    );
}

---

rootReducer

import { combineReducers } from 'redux';
import homeReducer from './containers/Home/home.reducer';
export default combineReducers({
    homeReducer
});

这里是full code

Answer 1

因为您使用的是CombineReducers，并且将减速器作为homeReducer传递给它。您还需要通过先访问homeReducer键来访问存储中的值。因此，您可以在Home.Container's mapStateToProps中写state.homeClick

而不是写state.homeReducer.homeClick

const mapStateToProps = state => {
  return {
    homeClick: state.homeReducer.homeClick
  };
};

Working codesandbox