Backbone.js и иерархии/деревья
Я работаю над приложением, которое нуждается в форме, которая позволяет пользователю управлять иерархией категорий продуктов, которые идут на произвольную глубину. Я могу довольно легко получить данные на странице, но я немного потерял то, что мне нужно сделать, чтобы такая работа работала с backbone.js. В принципе, я ищу вложенные UL. Когда пользователь выбирает один, я хочу, чтобы они имели возможность редактировать/удалять категорию или добавлять к ней другую категорию.
У меня возникают проблемы с поиском случаев в Интернете, где у кого-то есть произвольно глубокая иерархия одного и того же типа данных в backbone.js. Могу ли я просто создать класс модели с экземпляром моего класса коллекции? Как будет достигнуто экономия? Я знаю, что это немного широкий вопрос, но мне в основном нужны некоторые общие рекомендации о том, как подойти к этому (или, еще лучше, образец где-то, который я не смотрел).
Ответы
Ответ 1
Вы можете смоделировать дерево как коллекцию элементов с родительско-дочерними ссылками. Поэтому ваша модель должна иметь что-то вроде этого:
id: id,
parent_id: parent_id
Затем построим дерево из коллекции, используя рекурсивные вызовы функций в JS. Вот фрагмент кода:
function buildTree(branch, list) {
//recursively builds tree from list with parent-child dependencies
if (typeof branch == 'undefined') return null;
var tree = [];
for(var i=0; i<branch.length; i++)
tree.push( {
item: branch[i],
children: buildTree( list[ branch[i].id ], list)
});
return tree;
}
Прежде чем вызывать элементы группы функций с помощью parent_id, используя underscore.js(что является обязательным условием для backbone.js), а затем вызывается:
var list = _.groupBy(arrayOfItems,'parent_id');
var tree = buildTree(list[0],list);
Наконец, снова визуализируйте дерево, используя рекурсивные вызовы функций (здесь нет примера, но я считаю, что у вас есть идея).
PS. Добавление/сохранение элемента shoud не будет проблемой, если вы укажете правильный parent_id.
Ответ 2
Вы можете найти ответ по этой ссылке.
Магистраль с виджетами виджетов
У вас есть много способов создать иерархическое дерево. Один из них я написал в своем вопросе. Если хотите, попробуйте! Я использовал Backbone.js и Epoxy.js для его создания.
Ссылка на Epoxy.js
http://epoxyjs.org/index.html
Эта библиотека позволяет вам легко связывать разные события, что содержит дерево