如何将 redux 状态返回到初始状态？答案

【问题标题】：How to return redux state to initial state?如何将 redux 状态返回到初始状态？
【发布时间】：2016-02-18 09:14:38
【问题描述】：

我很难弄清楚这一点，基本上我正在尝试将状态设置为初始状态，到目前为止我尝试过：

// -- Initial state ------------------------------------------------------------
const INITIAL_STATE = {
  search: {
    listings: []
  },
  listings: []
}

// -- Story structure for story editor -----------------------------------------
export default function(state = INITIAL_STATE, action) {
  switch(action.type) {
    case ACTIONS.RESET_STATE:
      return { ...state, INITIAL_STATE }
    default:
      return state;
  }
}

这只是将初始状态添加到现有状态

case ACTIONS.RESET_STATE:
      return { ...state, state = INITIAL_STATE }

这会返回错误

case ACTIONS.RESET_STATE:
      return { ...state, state: INITIAL_STATE }

这是将初始状态添加到现有的增益中

case ACTIONS.RESET_STATE:
      return { ...state, search: { listings:[] }, listings: [] }

这可行，但我开始遇到奇怪的突变错误。

【问题讨论】：

标签： javascript state redux

【解决方案1】：

Anders 提出的解决方案是正确的，但存在不可变的潜在问题。这总是会生成新对象。

case ACTIONS.RESET_STATE:
    return { ...INITIAL_STATE };

【讨论】：

【解决方案2】：

请改用 Jiri Fornous 解决方案，因为这会改变您的数据。

更简单的方法是只返回 INITIAL_STATE。

case ACTIONS.RESET_STATE:
      return INITIAL_STATE;

【讨论】：

【解决方案3】：

如果你只是想完全重置状态，只需返回INITIAL_STATE的值：

export default function(state = INITIAL_STATE, action) {
  switch(action.type) {
    case ACTIONS.RESET_STATE:
      return {
                 search: {
                     listings: []
                 },
                 listings: []
             };
    default:
      return state;
  }
}

如果您想将INITIAL_STATE 保留在一个地方。将初始状态创建者更改为函数：

function get_INITIAL_STATE => {
  return { search: {
               listings: []
           },
           listings: []
         }
}

export default function(state = get_INITIAL_STATE(), action) {
  switch(action.type) {
    case ACTIONS.RESET_STATE:
      return get_INITIAL_STATE();
    default:
      return state;
  }
}

【讨论】：

由于某种原因返回 INITIAL_STATE 会返回它之前的样子
虽然更新后的答案会起作用，但正确的惯用方法是 Jiri Frnous'，如下所示。