【问题标题】:Redux: Filter data & rewind to initial data state in Reducer?Redux:在Reducer中过滤数据并回退到初始数据状态?
【发布时间】:2017-02-07 02:07:53
【问题描述】:

假设我有大量的 JSON 数据,我希望最初显示在页面加载(到目前为止工作)以及过滤该数据以仅显示特定数量的选项。当我的FILTER_DATA 操作被调度时,它会检查view 属性并执行帮助函数以将数据数组过滤到我需要显示的数量。

但是...如果我用过滤后的数据版本更新状态,假设用户想要返回原始视图(整个数据集),有没有办法倒带状态到那时? 我正在考虑重新调度 FETCH_DATA 操作以重新执行 GET 请求以再次获取数据,但这似乎令人讨厌。想法? 下面是我的减速器:

注意:initialState 对象上的data 是一个空数组值,直到FETCH_DATA_SUCCESS 调度并将state.data 设置为在GET 请求中获取的JSON 数据。

const app = (state = initialState, action) => {
  switch(action.type) {
    case FETCH_DATA:
      return { ...state, error: '', loading: true };
    case FETCH_DATA_SUCCESS:
      return { ...state, error: '', loading: false, data: action.data, view: 'all' };
    case FETCH_DATA_FAILURE:
      return { ...state, error: action.error, loading: false };
    case FILTER_DATA:
      let data;
      if (action.view === 'week') {
        data = groupData(getLastWeek(state.data), action.view);
      } else if (action.view === 'month') {
        data = groupData(getLastMonth(state.data), action.view);
      } else if (action.view === 'all') {
        data = state.data;
      }
      return { ...state, error: '', loading: false, data: data, view: view };
  }
  return state;
}

谢谢。

【问题讨论】:

    标签: json filter redux reducers


    【解决方案1】:

    有两个主要选项。首先,如果您确实想将“过滤”数据直接保留在您的状态中,您可以存储两个副本:“原始”和“过滤”版本。

    我推荐的另一种方法是将原始数据和过滤条件都保留在您的状态中,但实际上不要修改原始数据。相反,根据需要在存储之外派生过滤。这是“选择器功能”的一个很好的用例。有关示例,请参阅Computing Derived Data

    【讨论】:

    • 嗨。我正在尝试方法一。但我很难保持原件不变。每次我应用过滤器时,原始过滤器也会更改..可能是因为过滤后的过滤器具有原始的参考。我想保持原来的不变。我该怎么做?
    • 听起来你在这个过程中改变了原始数组。不要那样做:)
    猜你喜欢
    • 2017-03-26
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-02-18
    • 2021-01-02
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多