还原 redux 存储中的更改答案

【问题标题】：Revert changes in redux store还原 redux 存储中的更改
【发布时间】：2017-06-16 09:13:04
【问题描述】：

我有一个简单的问题。

现在在我的 App Redux 中，我有一个组合商店，当我获取数据时，它被设置为状态的一部分。

然后，我有一个通过 Redux 管理状态的 React 编辑器。当用户单击编辑时，所有字段都变为可编辑的。他可以乱七八糟，然后单击“丢弃”按钮并返回到获取数据的初始状态。

我正在尝试对原始获取的数据进行深度复制（在用户修改后），但之后我的商店中有正确的数据，但视图仍然显示修改后的数据（它通过 te react-redux 连接到商店）。

所以，我的问题是，如何以正确的方式让视图显示这些数据。下面是我的编辑器reducer。

case editorActions.DISCARD_CHANGES:
  return {
    ...state,
    editing: false,
    data: {
      ...state.data,
      ...mapGistToData(payload)
    }
  };

然后我将这样的原始数据传递给它：

onDiscardClick={discardChanges.bind(null, orginalGist)}

来自

orginal: deepcopy(payload),

【问题讨论】：

标签： javascript reactjs ecmascript-6 redux state

【解决方案1】：

假设数据存储在“数据”状态。

通过在初始设置期间传递来自 deepcopy 的原始数据来调用 actionCreator。

discardChange(original);

动作创建者：

export function discardChange(originalData) {
  return {
    type: DISCARD_CHANGES,
    payload: originalData
  }
}

减速机：

case editorActions.DISCARD_CHANGES:
  return {
    ...state,
    editing: false,
    data: editorActions.payload
  };

【讨论】：