Я боролся с этим в течение нескольких дней, пытаясь понять способ "реагировать" на это.
В принципе, у меня есть дерево, список списков (списков...), которые могут быть произвольно вложенными, и я хочу, чтобы компонент отображал это, а также разрешал перегруппировку.
Здесь мои данные:
var data = [{
id: 1
}, {
id: 2, children: [
{
id: 3, children: [{id: 6}]
}, {
id: 4
}, {
id: 5
}]
}]
Мой первый проход состоял только в том, чтобы иметь только один "древовидный" компонент, который строит вложенные списки элементов DOM в своей функции рендеринга (смотрите здесь код). Это действительно хорошо работает для небольшого количества элементов, но я хочу иметь возможность поддерживать сотни элементов, и была очень высокая стоимость рендера, когда элемент был перемещен внутри дерева (~ 600 мс, когда было несколько сотен элементы).
Поэтому я думаю, что каждый "node" дерева будет собственным экземпляром этого компонента. Но вот мой вопрос (извините за длинное введение):
Если каждый node динамически запрашивает список, это идентификаторы детей из центральной "базы данных" и хранят это в состоянии? Или должен ли самый верхний node загружать все дерево и пропускать все через реквизиты?
Я все еще пытаюсь задуматься о том, как нужно обрабатывать состояние и реквизит и разворачиваться.
Спасибо