Question

我试图为每个容器文件分隔reducer文件，导致每个容器的reducer导出不同，我将它与combineReducers结合起来。

我希望我的商店的状态结构如此：

state = {
      currentFilter: 'all',
      todos: [],
      displayed: [],
    }

但是得到这样的结构：

state = {
      addReducer: {
        currentFilter: 'all',
        todos: [],
        displayed: [],
      },
      displayReducer: {
        currentFilter: 'all',
        todos: [],
        displayed: [],
      },
      filterReducer: {
        currentFilter: 'all',
        todos: [],
        displayed: [],
      }
    }

我创建商店的方式：

const store = createStore(
      combineReducers({addReducer, displayReducer, filterReducer}),
      applyMiddleware(thunk, logger)
    );

问题是当一个动作被调度时，更新的状态'slice'只是与处理该动作的reducer关联的部分（在下面的例子中，只有addReducer上的切片得到了更新。 / p>

我编写Reducer的方法只是为每个reducer文件导出1 reduce函数。

是否有任何解决方法可以处理这个问题，或者是一种更好，更正确的方法来处理多个reducer，以便“我的Redux商店”真正发生“单一事实来源”概念（而不是针对不同减速器的不同来源）？谢谢！

编辑：我的一个减速器（另外两个与这个非常相似，仅接受1个开关盒和默认情况）

export default function reduce(state = initialState, action) {  
  switch (action.type) {
    case types.ADD_TODO:
      let newTodos = [...state.todos, action.data.todo];
      let newDisplayed = [...state.displayed];
      if (state.currentFilter !== 'completed') {
        newDisplayed.push(action.data.todo);
      }
      console.log(Object.assign(
        {},
        state,
        {
          todos: newTodos,
          displayed: newDisplayed,
        }
      ));
      console.log('newTodos:', action.data.todo);
      return Object.assign(
        {},
        state,
        {
          todos: newTodos,
          displayed: newDisplayed,
        }
      );
    default:
      return state;
  }
};

Answer 1

我认为你是混乱的东西，你应该只有一个减速器而不是三个（在你的场景中）。您应该创建不同的reducer来管理状态的不同部分，您不应该为处理不同功能的状态的相同部分创建不同的reducer。你有动作创作者。

你从一开始就打破了“单一的事实根源”原则。所以我的建议是只在你的情况下有一个减速器。

通过很好的示例查看文档以获取更多相关信息。 LINK

只是命名表明存在混淆，您应该有python file.py "$1" "$2"与您应用中的todoReducer资源相关联。 todo与其他两种操作的操作类型相关联，这不是您想要做的。

我希望这可以澄清一些事情，但如果有疑问，请查看redux文档，它们非常棒！

Redux商店在减速器名称下具有多个“版本”状态

1 个答案: