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)) {
     ...
   }
 }

我做得如此之多，以至于没有一种方法可以对减速器返回的“状态”变化做出反应（除非有），这让我觉得我做错了。

在cDU中简化我的长if(prevProps...!==... && ..)条件的一种方法是将每个化简器包装在一个函数中，该函数在其响应中添加时间戳：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`);
  }

  ...
}

React / Redux：向reducer返回的所有内容添加时间戳以检测更新

1 个答案: