Question

所以我们大约有两个月的时间参与一个项目。这是我第一次管理代码编写器而不是自己编写代码。我上周一直在阅读他们的代码。什么被认为是一个简单的React应用程序变成了意大利面条混乱。

我理解：redux有助于管理全球状态。但是，这是否意味着所有按钮都应映射到全局“动作”？这似乎创造了整个应用程序中分散的整个对象。我一直在问自己，为什么当本地状态可用于90％的应用程序时，我们使用全局状态。这种代码让我感到胃灼热：

let subitems = SidebarItems[state.type].sub_items;
Store.dispatch(SidebarSubItemHandler(item.action, subitems[0], null));

if(item.sub_items[subitems[0]].param) {
    browserHistory.push(`${item.sub_items[subitems[0]].path}/${item.sub_items[subitems[0]].param}`);
} else {
    browserHistory.push(item.sub_items[subitems[0]].path);
}

subItembuttons = Object.keys(this.props.subitems.sub_items).map(subitem => {
    let subItem = this.props.subitems.sub_items[subitem];
    return <li className={this.props.activeSubItem.action == subItem.action ? "bottom-bar-item active" : "bottom-bar-item"}
               onClick={e => this.props.onClickSubItem(e, subItem)}
               key={subItem.action} style={this.props.subitems.inlineStyles.mobileSubItemLI}>
        <a href="">{subItem.item}</a>
    </li>;
});

应用程序中充斥着各种类似的对象，这些对象映射到“action”对象。所以在这一点上，我们决定废弃整个项目并从头开始重新启动，但没有redux。让我们尝试尽可能多地使用本地状态。当它到来的时候，我们需要全局状态的东西，只为那个东西实现它，而不是应用程序中的每一个动作。这有意义吗？

所以我想我的问题是：如果我们使用本地状态和基本的React开发应用程序，我们是否会创建不可逆转的问题，这会阻止我们在每个项目的基础上实施redux？

Answer 1

引自http://redux.js.org/docs/faq/OrganizingState.html#organizing-state-only-redux-state的相关Redux FAQ条目：

使用本地组件状态很好。作为开发人员，您的工作是确定应用程序的状态，以及每个州应该居住的位置。找到适合您的天平，并随身携带。

确定应将哪种数据放入Redux的一些常用经验法则：


应用程序的其他部分是否关心此数据？

您是否需要能够根据此原始数据创建更多衍生数据？

是否使用相同的数据来驱动多个组件？   能够将此状态恢复到给定时间点（即时间旅行调试）对您有价值吗？

您是否要缓存数据（例如，如果已经存在，请使用状态，而不是重新请求数据）？

根据您的具体问题：如果您使用＆＃34;容器组件＆＃34;模式相当一致，交换那些＆＃34;简单的React＆＃34;应该相对简单。 Redux连接容器的容器。有关＆＃34;容器/演示组件＆＃34;的文章，请参阅https://github.com/markerikson/react-redux-links/blob/master/react-component-patterns.md#component-categories。图案。

另外两个想法。首先，我最近与人合着了一篇讨论why you might want to use Redux in a React application的文章。

第二：是的，那段代码看起来有点难看。我希望这些代码库的不同部分至少有三个不同的代码段，而不是一个代码段，但这很难阅读。重复使用＆＃34; sub_items＆＃34;和＆＃34;子项目＆＃34;看起来像是一面红旗，可读性方面。

它也不像是在遵循良好的Redux实践。例如，惯用的Redux代码几乎从不直接引用存储。相反，可以通过中间件提供对dispatch和getState的引用，因此可以通过redux-thunk和redux-saga在动作创建者中使用。已连接的组件也可以访问dispatch。

总体而言：绝对欢迎您根据需要使用尽可能多的Redux，也可以根据需要使用尽可能多的本地组件状态。不过，我认为更大的问题是你的团队对Redux的理解程度，以及他们如何尝试使用它。

ReactJS本地vs全局状态，并在以后实施redux

1 个答案: