这是使用 React 上下文 API 的好设计吗答案

【问题标题】：Is this a good design for using React context API这是使用 React 上下文 API 的好设计吗
【发布时间】：2019-09-27 07:07:12
【问题描述】：

我正在开发一个 React 项目，该项目分为几个模块，每个模块包含几个组件。还有一个commons 模块，其中包含两个或多个独立模块共有的组件。我正在使用上下文 API 来管理所有状态。下面是父组件（App.js）的结构。 Module1Container, Module2Container... 包含各个模块的组件。

return(
    <CommonsContextProvider>
        <Module1ContextProvider>
            <Module1Container />
        </Module1ContextProvider>
        <Module2ContextProvider>
            <Module2Container />
        </Module2ContextProvider>
        <Module3ContextProvider>
            <Module3Container />
        </Module3ContextProvider>
    </CommonsContextProvider>
)

我主要希望将状态分开，因为每个模块的单个上下文会使其过于混乱。为每个模块设置一个单独的上下文，为跨模块的常用状态设置一个通用上下文是个好主意吗？这种结构不是使单一事实来源规则无效吗？欢迎提出更好的建议。

【问题讨论】：

标签： javascript reactjs redux state jsx

【解决方案1】：

这种方法目前没有问题，但是长期来看，如果需要维护项目单源还是比较好的，

对于单一事实来源，请使用 redux (redux-hooks) 和如果你需要模块化的状态视图，对不同的组件使用不同的减速器，对全局状态使用通用的减速器，然后使用 redux 的 combineReducer 将它们组合起来

【讨论】：