当前位置: 首页 > 知识库问答 >
问题:

在React中使用不可变状态的缺点是什么?

贺景铄
2023-03-14

我已经以“正常”的方式构建了我的第一个React应用程序,其中包含有状态存储,现在我正在研究如何使用Este starterkit中使用的不可变全局状态。

  • 所有存储的状态都保持在一个单一的不可变数据结构中
  • 组件没有状态,但基于存储getter函数访问其渲染()中的数据
  • 存储也是无状态的,但是使用游标改变其域的全局应用程序状态。
  • 顶层应用组件侦听状态变化,并重新呈现整个组件树。
  • 组件被实现为"纯",这意味着它们使用应组件更新来有效地计算它们可以在重新渲染中跳过。

它通过以下几种方式简化了应用程序结构:

  • 组件不侦听存储,也不将存储数据复制到其本地状态。它们只需在每次渲染时获取存储状态

我只读过关于在React中使用不可变数据的积极内容,建议避免组件中的状态,所以我想知道是否有任何缺点。我想肯定有,否则我不明白为什么不推荐它作为构造React应用程序的方法。

不变性对我来说是新事物,所以如果我开始在复杂的现实世界应用程序中使用这种方法,有什么需要注意的地方吗?

我能想到的唯一一件小事是使用forceUpdate(),因为Este正在使用它,因为我已经读到它是一个同步函数。例如,MyReTy似乎推迟了下一个动画框架的更新以便批量化它们,但是我认为这是一个实现细节/优化,而不是一些不可变的单一状态方法的继承下限。

共有3个答案

南宫海超
2023-03-14

我知道答案已经被接受了,但是我发现主要的缺点是您将非普通的JavaScript对象传递到您的组件代码中,这意味着当您从通过props传递的不可变对象中读取值时,您不能使用常规的JavaScript属性访问器。相反,您必须使用mmutable.js读取应用编程接口。这是一个重要的权衡。您不能将对Immutable.js的使用包含在它所属的存储中;它现在已经在整个应用程序中泄露了自己。当我mmutable.js被下一个时髦的不可变库取代时,你可能会感到痛苦,这个库有自己的应用编程接口或者能够使用本地属性访问器。此外,第三方代码几乎肯定会期望普通的旧JavaScript对象,所以不可变对象在传递之前需要转换。如果你计划将我mmutable.js引入现有的应用程序,在你的组件代码中,哪些props是不可变的,哪些是JS对象会很快变得不清楚,除非你非常有纪律并想出一个命名方案或者在渲染链中传递对象时与之一致的其他方法。

丁勇
2023-03-14

通过道具传递数据的一个优点是,您可以利用shouldComponentUpdate进行更高性能的更新。如果假设数据总是来自父级(例如,通过道具),则可以有效地防止组件树的很大一部分不得不重新加载。不可变的值使这非常好,因为您可以在组件层次结构中相对较高的位置执行shouldComponentUpdate中的引用相等性检查。

在React中使用不可变数据时,我发现的另一个缺点是React开发者工具不能很好地使用它们(它们显示不可变值的底层数据结构,而不是JS友好的值)。

呼延钱明
2023-03-14
  1. 文件。SO中投票最多的一些问题/咆哮都是关于更新嵌套列表项之类的琐事,这是因为文档更面向熟悉函数式编程的读者,这使得其他人更难接近
 类似资料:
  • 问题内容: 我已经以“正常”方式用状态存储构建了我的第一个React应用程序,现在我正在研究使用像Este入门套件中所使用的不可变全局状态。 所有存储的状态都保存在一个不变的数据结构中 组件没有状态,但是根据商店的getter函数访问其render()中的数据 存储也是无状态的,但是会使用游标更改其域的全局应用程序状态。 顶层应用程序组件侦听状态更改,然后重新呈现整个组件树。 组件被实现为“纯”的

  • 问题内容: 我知道状态允许我们创建动态和交互的组件,但是我想深入了解状态。 有人可以通过一个真实的例子来帮助我理解React中的状态吗? 问题答案: 在上面的代码中,它有一个带有:count 的对象。 状态可以简单地理解为特定组件/应用在该时间点的值。在上面的示例中,当应用首次运行时,该应用处于状态 如我们所见,有两个按钮,它们使用来更新值,它只是更新应用计数的“状态”,并且只要状态改变,应用都会

  • 我们正在热烈讨论如何在React中更新嵌套状态。国家是否应该是不可改变的?优雅地更新状态的最佳实践是什么? 假设你有这样的状态结构: 然后我们要更新乔·多伊的电话号码。我们有几种方法可以做到这一点: 将状态强制更新更改为重新加载 带变异状态的变异状态集合状态 Object.assign,这仍然会改变状态,因为new学生只是对this.state指向的同一对象的新引用 更新不变性助手(https:/

  • 本文向大家介绍在react中怎样改变组件状态,以及状态改变的过程是什么?相关面试题,主要包含被问及在react中怎样改变组件状态,以及状态改变的过程是什么?时的应答技巧和注意事项,需要的朋友参考一下 可以从生命周期的角度来答,对于已经挂载的组件,props 传进来后首先会调用componentWillReceiveProps,然后调用shouldComponentUpdate,若shouldCom

  • 问题内容: 假设我有一个普通对象列表,然后可以用来呈现子级列表。那么将对象插入其中的正确方法是什么? 以下是我认为它将起作用的唯一方法,因为您不能像文档中提到的那样直接更改。 这对我来说似乎很丑。有没有更好的办法? 问题答案: 返回一个新数组,所以你可以做 另一个选择是React的不变性助手

  • 问题内容: Java中不变对象的优点显而易见: 一致状态 自动线程安全 简单 您可以通过使用私有final字段和构造函数注入来支持不变性。 但是,在Java中偏爱不可变对象有哪些弊端? 即 与ORM或Web演示工具不兼容? 不灵活的设计? 实施的复杂性? 是否可以设计一个主要使用不可变对象的大规模系统(深层对象图)? 问题答案: 但是,在Java中偏爱不可变对象有哪些弊端?与ORM或Web演示工具