每次,当控件挂载到控件树上时,Flutter 调用其 createElement() 方法,创建其对应的 Element。Flutter 再将这个 Element 放到元素树上,并持有创建它控件的引用,如下图:
控件会有它的子树:
子控件也会创建相应 Element 被放在元素树上:
4Element 中的状态
我们上文提到了 Widget 的不可变性,相应的 Element 就有其可变性,正如我们前文所说的它被标记为 dirty Element 便是作为需要更新的状态,另外一个我们需要格外注意的是,有状态组件(StatefulWidget)对应的 State 对象其实也被 Element 所管理,如下图所示。
Flutter 中的 Widget 一直在重建,每次重建之后,Element 都会采用相应的措施来确定是否我对应的新控件跟之前引用旧控件是否有所改变,如果没改变则只需要做更新操作,如果前后不同则会重创建。那么,Element 根据什么来确定控件是否改变呢?它会比较 Widget 以下两个属性:
-
组件类型
-
Widget 的 Key (如果有)
组件类型即前后控件的是否是同一个类所创建的,Key 即为每个控件的唯一标识。
5 渲染树详解
我们已经大致知道 Flutter 中的三棵重要的树及 Element 树的工作原理&