ReactJS -组件外部的全局状态
我一直在阅读和观看Redux上的视频，看到很多关于在组件中或使用Redux管理状态的争论。我没有看到任何关于使用标准全局变量完全在组件之外管理状态的内容。
例如，我可以像这样设置一个全局状态变量：
let state = {
player: {
username: "BillyBob",
score: 100
}
}然后在一个React组件中，我可以有这样的东西：
incrementScore() {
state.player.score += 1
props.update()
}然后在App.js中，我可以这样做：
update() {
this.forceUpdate()
}我意识到我仍然必须在树中向下传递更新函数，但我至少能够在组件级别设置函数，而不必担心将多个状态和函数传递给子组件。
我是个新手，但我能想到的唯一缺点就是不能要求propTypes。我还有什么遗漏的吗？
编辑:根据我澄清这个问题的请求，上面的实现有没有什么我应该考虑的主要缺点，甚至会影响到一个相对简单的应用程序？
回答 4
Stack Overflow用户
发布于 2018-06-05 08:20:30
如果您查看redux或其他状态管理库(例如mobx或mobx-state-tree)的实现，基本上所有这些库都将组件外部的状态作为独立对象进行维护。
然而，为了有效地检测更改和触发重新呈现，他们实现了一个HOC，它是redux中的connect，mobx中的inject，HOC (高阶组件)所做的是将您的组件包装在另一个可以访问全局state的组件中，并通过它的属性传递组件所需的状态部分。这样，组件仅在其所需的数据发生更改时才重新呈现。
与这些流行的库方法相比，您提出的解决方案存在一些问题。
第一个是使用forceUpdate，基本上，你可能想要做的最后一件事是在你的应用程序的根节点上调用forceUpdate，想想当有人输入一个输入，整个应用程序重新呈现每一次击键的场景。
第二种方法是将一个update函数向下传递到多层子组件，如果你只有一两个嵌套的组件，这是很好的，但如果你的应用程序增长了，这将是一个大问题。随着应用程序的增长和状态变得越来越复杂，使用单个update函数来控制整个state对象可能不是最好的主意。
Stack Overflow用户
发布于 2018-06-05 22:28:03
React的存在是为了解决创建用户界面的问题，该用户界面由几个独立的部分组成，这些部分可以并行开发，并且可以彼此无缝交互。
如果你打算使用全局命名空间来定义你的状态，那么你将绕过React的大多数关键特性，例如：
Lifecycle methodsVirtual DOMControlled ComponentsRendering优化
简而言之，您最终将承担运行React的所有开销成本，同时错过它的好处。
学习新框架或新范式的“陷阱”是理解如何定义问题，使其通向阻力最小的路径。这可以通过引入约束然后在该约束内解决问题来实现。
通过偏爱普通的JavaScript来进行状态管理，您没有给React和Redux一个公平的机会。
Stack Overflow用户
发布于 2020-06-18 16:31:29
我已经为这个用例创建了一个库:)
React的简单快速⚡️和小(500字节)全局状态管理，也可以在React组件外部使用！
https://stackoverflow.com/questions/50690156
复制相似问题