Как удалить узлы из дерева рендеринга?

Мне кажется, что я пропускаю что-то очевидное, но как удалить узлы из дерева рендеринга и правильно их уничтожить?

Похоже, я могу просто сделать что-то вроде mainCtx._node._child.splice(2,1), но это не работает во всех случаях (похоже, что прокрутки просматриваются), и предположим, что в API есть что-то актуальное, но я не могу найти его.

Ответы

Ответ 1

Вы никогда не удаляете renderNodes - вы используете интеллектуальные RenderNodes для управления отображаемым.

Решение зависит от того, что вы хотите выполнить:

1) Я хочу манипулировать макетом

Самый простой способ показать/скрыть/заменить части RenderTree - использовать RenderController. Вы можете даже указать входы/выходы

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

См. официальный

2) Я хочу управлять производительностью (и удалять вещи, которые мне не нужны)

Не беспокойтесь об удалении узлов. Famo.us будет управлять этим для вас.

Если вы хотите взять управление отображаемыми узлами, напишите пользовательский View с помощью функции render. Класс Flipper - простой пример (и RenderController - сложный пример этого шаблона)

Подробное объяснение:

  • Каждый RenderNode имеет функцию render, которая создает renderSpec.
  • renderSpec содержит информацию о Modifier или Surface.
    • Спецификации Modifier используются для вычисления окончательных свойств CSS.
    • Спецификации Surface связаны с элементами DOM.
  • Каждый тик Engine, renderSpec отображается с помощью функции RenderNode.commit.
  • Функция commit использует ElementAllocator (из Context) для выделения/освобождения элементов DOM. (Который фактически перерабатывает узлы DOM для сохранения памяти)

Поэтому: просто верните правильный renderSpec в свой пользовательский View, и 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 путем манипуляции с renderspec может привести к снижению производительности!