React / Redux: добавьте метку времени ко всему, что возвращается редуктором, для обнаружения обновлений

Question

Я постоянно пишу длинные условия в componentDidUpdate, чтобы делать что-то, когда новые / разные данные поступают из базы данных, иногда прибегая к lodash для сравнения больших объектов.Случайный пример из файла, на который я смотрю:

 componentDidUpdate(prevProps) {
   // If there are messages, and they are different, clear replyFormPosition build new message tree.
   if (messages.length > 0 && !_.isEqual(messages, prevProps.discussion.messages)) {
     ...
   }
 }

Я делаю это настолько, что уже не существует способа реагировать на изменения «части» состояния, возвращаемой редуктором.(если это не так) заставляет меня думать, что я делаю что-то не так.

Один из способов упростить мои длинные if(prevProps...!==... && ..) условия в cDU - заключить каждый редуктор в функцию, которая добавляет метку времени: Date.now ()на его ответ.Тогда я мог бы просто сделать

 if (prevProps.statePiece.timestamp !== props.statePiece.timestamp) {
   this.doSomethingWithUpdatedData()
 }

Мой первый вопрос: где будет объект, который я заверну?Может быть, редукторы, которые я передаю combineReducers?

 export default combineReducers({
   auth: addTimestamp(authReducer),
   discussion: addTimestamp(discussionReducer),
   group: addTimestamp(groupReducer),
   notifications: addTimestamp(notificationReducer),
   ...
 });

Но, что более важно, мой второй вопрос: почему я единственный, у кого есть эта проблема?Это заставляет меня думать, что я делаю что-то не так.Есть ли более простой способ сделать что-то в ответ на новые данные из БД?

Спасибо!Дайте мне знать, если мне неясно.

Answer 1

Я заменил combineReducers на эту функцию:

function(state = {}, action = {}) {
  return {
    // Add the action type at the top level
    actionType: action.type,

    // Add the reducers
    discussion: discussionReducer(state.discussion, action),
    group: groupReducer(state.group, action),
    itemHistory: itemHistoryReducer(state.itemHistory, action),
    ...
  }
}

Это упростило, например, перенаправление при отправке формы:

componentDidUpdate() {
  if (this.props.actionType === "UPSERT_RESOURCE_ITEM") {
    this.props.history.push(`some URL`);
  }

  ...
}