Javascript 在React中管理大型状态树

Javascript 在React中管理大型状态树,javascript,reactjs,Javascript,Reactjs,我有一些粗略形式的数据: 父母->子女->孙子->曾孙 我为树中的每个级别创建了一个组件,顶部组件将整个树存储为状态,并通过道具等将分支向下传递给其子级 由于顶层组件管理状态,因此它负责对任何子级进行CRUDE。如果我只是想添加一个新的曾孙,我必须替换父组件上的整个状态树。这是一种效率极低的方法,还是将解决重新渲染哪些组件的问题?是否有更好或更惯用的方法来实现我的需求?对于这个例子。这基本上意味着向所有子组件添加key={someUniqueId}属性 “当React协调键控子项时,它将确保任何

我有一些粗略形式的数据:

父母->子女->孙子->曾孙

我为树中的每个级别创建了一个组件,顶部组件将整个树存储为状态,并通过道具等将分支向下传递给其子级

由于顶层组件管理状态,因此它负责对任何子级进行CRUDE。如果我只是想添加一个新的曾孙,我必须替换父组件上的整个状态树。这是一种效率极低的方法,还是将解决重新渲染哪些组件的问题?是否有更好或更惯用的方法来实现我的需求?

对于这个例子。这基本上意味着向所有子组件添加
key={someUniqueId}
属性

“当React协调键控子项时,它将确保任何具有键的子项都将重新排序(而不是删除)或销毁(而不是重新使用)。”

回答你的问题

这是一种效率极低的方法吗

是的,如果不为其中一个叶中的每个小更改使用键控子级,则整个树将从根开始重建