/reducers/index.js
import * as types from '../actions/ActionTypes';
var initialState = {
categoryName: 'default name redux'
};
function re_modifyCategoryName(state=initialState, action) {
switch(action.type) {
case types.MODIFY_CATEGORY_NAME :
return Object.assign({}, state, {
categoryName: action.categoryNewName
});
default:
return state;
}
}
export {re_modifyCategoryName}
I definitely check state of redux store is updated by Redux-dev-tool and redux-logger,
but mapStateToProps is not being called.
PresentationalComponent.js
...
const mapStateToProps = (state) => {
console.log("inside category name", state.categoryName);
return {categoryName: state.categoryName}
};
export default connect(mapStateToProps)(AnswerEachCategory);
...
When the page is rendered first time, as you can see mapStateToProps, "inside category name", state.categoryName is shown in console and presentational component correctly get props.categoryName from initialState of redux store. However, why the change in redux store didn't trigger mapStateToProps??
Is this problem related with immutability of state of redux store?
Container.js
...
const mapDispatchToProps = (dispatch) => ({
onModifyCategoryName: (categoryNewName) => {
dispatch(actions.modifyCategoryName(categoryNewName))
}
})
export default connect(null, mapDispatchToProps)(ModifyCategoryNameModal)
...
