Я не согласен, вам не нужно ничего из этого:
componentWillReceiveProps(nextProps) // maybe not this one
componentDidUpdate(prevProps) // probably this one
shouldComponentUpdate(nextProps, nextState) // possibly this one but not likely
Я имею в виду, что это цель реагирования и редукции, изменения состояния -> проверяет, изменен ли реквизит -> если да, то повторная визуализация.Приведенные выше функции полезны для гораздо более сложных случаев, чем этот.
Что неправильно, так это способ написания вашего редуктора.Пожалуйста, попробуйте перейти к чему-то более простому, чтобы проверить.Пожалуйста, попробуйте этот переключатель для начинающих:
switch (action.type) {
case "HANDLE_BODY_CHANGE_RESERVATION":
return { ...state, MenuBoxes: { box11: "test" } };
break;
default:
return state;
break;
}
Я уверен, что он будет работать.Тогда начнем с более сложного.
Наконец, я предполагаю, что ошибка в том, как вы обрабатываете состояние в редукторе.Никогда не делайте этого:
const new_state = {...state};
Делая это, вы непосредственно изменяете состояние ниже (мы никогда этого не делаем) .
То, как вы должны это сделать, это создать новый объект, который включает в себя все изменения состояния:
let new_state = {};
...
new_state.body = "reservation";
new_state.MenuBoxes = {};
new_state.MenuBoxes.box12 = "DELETE A \n RESERVATION";
и, в конце, вернуть предыдущее состояние вместе с такими изменениями, как это:
return { ...state, ...new_state };
Я не эксперт, но я думаю, что сейчас вы изменяете состояние, поэтому новое состояние = старое состояние => повторных визуализаций не требуется