redux 中 reducer 的先前状态与 react

Question

这是我的减速器的样子：

export default function catalogReducer(state = initialState.catalogItems, action){
  switch (action.type) {
    case types.LOAD_CATALOG_SUCCESS:
      return {
         count:action.count,
        products :[...state['products'],
        action.catalogItems  ?
        [...action.catalogItems['products']]
          :
          []
      ]
    default:
      return state;
  }
}

我想做的事：

1. 这是用于加载目录项的减速器

2. 项目来自分页的 api。

3. 我需要将来自 api 的结果添加到现有的产品列表中

问题：

我希望 state 参数应该与之前的状态相关联，但不，它总是从 initialState 获取值，我在应用程序启动时用它来初始化状态。

这是为什么？它的出路是什么？

基本上我需要通过分页api返回完整的项目集，而不仅仅是products数组中给定页面的产品。我最终得到的只是来自上次 api 调用的产品数组，因为state.products总是被初始化为空数组

另外，一般来说，我对在 react 和 redux 中处理分页 api 感到非常困惑，并且无法找到一个简单的例子。

一个方向将不胜感激。

这是 initialState.js 文件的样子：

import cookie from 'react-cookie';

export default {
 categories:[],
  sessionId: cookie.load('sessionId') || '',
  youMayLikeItems : [],
  catalogItems: {'products': []}
}

//这个文件是为了集中初始化store中的状态

Answer 1

基本上，你需要记住你不应该改变状态。

export default function catalogReducer(state = initialState, action) {
  switch (action.type) {
    case types.LOAD_CATALOG_SUCCESS:
      return {
        ...state,
        catalogItems: {
          count: action.count,                          
          products: [
            ...state.catalogItems['products'],
            action.catalogItems  ?
              action.catalogItems['products']
              :
              {}
          ]
        }
  default:
    return state;
  }
}

你可以在这里找到更多有用的例子

此外，最好制作没有深层对象的简单状态（文档）并使用 Immutable.js