使用键来识别React.js中的嵌套组件

时间:2014-11-19 21:48:57

标签: javascript reactjs

是否有可能阻止组件在将其从一个上下文“移动”到另一个上下文时调用其生命周期?

最初,我有一个组件列表,由id键入。这很有用,因为当我重新排序列表时,组件不会重新调用所有生命周期方法,它们只会“移动”。

很明显,我的设计必须从[Widget]移动到[Row],其中Row = [Widget]。 项目现在从行移动到行,但始终具有相同的ID。无论如何,当组件移动到新上下文时,所有(包括componentWillMount)都会调用生命周期方法。

是否可以在整个渲染上下文中全局识别组件以防止此行为?或者我应该追求另一种设计吗?

[       ][       ][       ] <- rows, don't care
 |||||||  |||||||  |||||||  <- significant
       ^ <- this
[      ][        ][       ] 
 ||||||  ||||||||  |||||||
         ^ <- should be able to move

1 个答案:

答案 0 :(得分:0)

协调算法在文档中有详细说明: http://facebook.github.io/react/docs/reconciliation.html

据我所知,阅读它,你无法实现你想要的目标:

  

在当前的实现中,你可以表达一个事实   子树已经在其兄弟姐妹之间移动,但你无法分辨   它已移动到其他地方。该算法将重新渲染完整   子树。