Мониторинг переменной на предмет изменения и обновления состояния
В настоящее время я пытаюсь определить свои варианты мониторинга переменной в React / Redux и использования ее для обновления состояния при его изменении.
Это относится к другому вопросу, который я задал здесь (Математика в Redux-форме. Сложение полей вместе, если вам нужен контекст), но относится к тому, как отслеживать и вызывать событие изменения.
Я использую 3 части состояния (сопоставленные с реквизитами) и складываю их вместе вот так ...
let total = (this.props.sub1 + this.props.sub2 + this.props.sub3);
Затем я хочу обновлять свое состояние редукции для total каждый раз, когда изменяется total ...
В настоящее время я слежу за изменениями в каждой части подсостояния, а затем обновляю итоги вот так ...
if (this.props.sub1 != prevProps.sub1 ||
this.props.sub2 != prevProps.sub2 ||
this.props.sub3 != prevProps.sub3){
this.props.dispatch(change('mainForm', 'total', total));}
Это работает, но похоже, что должен быть способ просто отслеживать общую сумму по каждому из подпрограмм, чтобы установить это состояние. Что-то вроде этого...
if (this.props.total != prevProps.total){this.props.dispatch(change('mainForm', 'total', total));}
но это работает :)
Мысли?
Ответы 2
Создание this.props.total имеет смысл, когда total визуализируется в разных компонентах с sub1, sub2 и sub3.
total можно рассчитать по контейнеру.
Также рассмотрите возможность использования повторного выбора (https://github.com/reactjs/reselect).
React (и Redux) выступает за наличие единого источника достоверной информации для всего состояния приложения. В данном случае total - это просто то, что построено на базе sub. Таким образом, имеет смысл не включать его в магазин (если sub уже находятся в магазине), а просто вычислять его в самом компоненте.
Это можно сделать в mapStateToProps в connect или с помощью селектора (например, reselect).
connect(
function(state, ownProps) {
return {
total: state.total.sub1 + state.total.sub2
}
}
)
Откуда берутся реквизиты
sub1,sub2иsub3? Они тоже есть в магазине?