18

我觉得我遗漏了一些明显的东西，但是如何从渲染树中删除节点并正确销毁它们？

看起来我可以做类似的事情mainCtx._node._child.splice(2,1)，但这并不是在所有情况下都有效（Scrollviews 似乎一直存在），并假设 API 中有一些相关的东西，但我似乎找不到它。

4

1 回答 1

26

您永远不会删除 renderNodes - 您使用智能 RenderNodes 来操作渲染的内容。

解决方案取决于您要完成的任务：

1）我想操纵布局

显示/隐藏/交换部分 RenderTree 的最简单方法是使用RenderController. 您甚至可以指定输入/输出转换

var renderController = new RenderController();
renderController.show( .... );
renderController.hide( .... );

看官方例子

2）我想管理性能（并删除我不需要的东西）

不要担心删除节点。Famo.us 将为您管理。

如果您想控制渲染节点，请View使用render函数编写自定义。Flipper 类是一个简单的示例（而 RenderController 是该模式的一个复杂示例）

深入解释：

  1. 每个RenderNode都有一个render创建renderSpec的函数。
  2. renderSpec包含有关 aModifier或的信息Surface。
    • Modifier规范用于计算最终的 CSS 属性。
    • 规范与SurfaceDOM 元素耦合。
  3. 的每个刻度Engine，renderSpec都会使用该RenderNode.commit函数呈现。
  4. 该commit函数使用ElementAllocator(from Context) 来分配/解除分配 DOM 元素。（实际上是回收 DOM 节点以节省内存）

因此：只需在您的 custom 中返回正确的renderSpecView，famo.us 就会为您管理内存和性能。

顺便说一句，您不需要使用View该类 - 具有render函数的对象就足够了。该类View只是添加事件和选项，这是创建封装的、可重用组件的好方法。

更新：现成的解决方案

ShowModifier (gist)一个简单的修饰符，用于显示/隐藏部分渲染树

 var mod = new ShowModifier({visible:true});
 mod.visible = true;
 mod.show();
 mod.hide();

或者，作为替代方案，使用此要点将可见性功能添加到Modifier和StateModifier

 modifier.visibleFrom(function(){ return true; }) // function, getter object or value
 stateModifier.setVisible(true); // or false

警告：通过操作渲染规范添加/删除 DOM 节点可能会导致性能损失！

于 2014-04-16T09:53:43.343 回答