Question

重置redux商店的子树的正确方法是什么？我对重置整个redux存储不感兴趣，只是重置它的reducer子树部分。

以下是一个示例代码段：

//initial state
const initialState = {
    isFetching: false,
    error: '',
    page: 0
}

//reducer for suggestions store
export default function suggestions (state = initialState, action) {
    switch (action.type) {
        case FETCHING_SUGGESTIONS : {
            return {
                ...state,
                isFetching: true
            }
        }
        case FETCHING_SUGGESTIONS_SUCCESS : {
            return {
                ...state,
                [action.suggestion.suggestionId] : action.suggestion
            }
        }
        case FETCHING_SUGGESTIONS_ERROR : {
            return {
                ...state,
                isFetching: false,
                error: "Error in fetching suggestions"
            }
        }
        case CHANGE_PAGE : {
            return {
                ...state,
                page: action.page
            }
        }
        case ADD_SUGGESTION : {
            return {
                ...state,
                [action.suggestion.suggestionId]: action.suggestion
            }
        }
        case CLEAR_SUGGESTIONS : {
            return {
                initialState
            }
        }
        default : 
            return state
    }
}

我认为这会有效，但每当调度CLEAR_SUGGESTIONS操作时，我突然在我的某些组件中得到未定义的道具，并出现以下错误： warning.js：36警告：performUpdateIfNecessary：意外的批号（当前161，待处理157）

我没有100％自信我正确地做到了这一点。有人可以确认问题是我的reducer，还是我的组件生命周期方法的某个地方？

谢谢！

Answer 1

您创建的对象将如下所示：

{
  initialState: {
    isFetching: false,
    error: '',
    page: 0
  }
}

你想要的是这个：

case CLEAR_SUGGESTIONS : {
  return {
    ...initialState
  }
}

Answer 2

您不小心将initialState嵌套在名为'initialState的键下。你只想要：

case CLEAR_SUGGESTIONS : {
  return initialState
}

不需要复制initialState，因为存储状态是不可变的。

Redux - 重置子树的状态

2 个答案: